infotechnohelp / cakephp-angular-1
CakePHP 3 内置的 Angular 1 插件
This package is not auto-updated.
Last update: 2024-09-24 06:05:29 UTC
README
加载插件
APP/config/bootstrap.php
Plugin::load('Angular1', ['routes' => true]);
基本实现
APP/src/Template/Layout/default.ctp
(或任何 .ctp
)
注意!!! 请勿忘记首先加载 jQuery
js 变量 angular1container
和 angular1
应当未被定义
<?= $this->element('Angular1.initBasic') ?>
<div data-ng-app="App"></div>
现在您可以在 data-ng-app
元素内添加自定义 Angular 控制器
自定义控制器
APP/webroot/js/Angular/Controller/Any/index.js
app.controller('any', function ($scope, $rootScope) {
$scope.init = function () {};
});
... .ctp
<?= $this->Html->script('Angular/Controller/Any/index') ?>
<div data-ng-app="App">
<div ng-controller="any" ng-init="init()"></div>
</div>
服务 API
设置默认 API 参数
默认情况下,js 变量 angular1
拥有如下参数
angular1.api.root: <?= \Cake\Routing\Router::url('/') ?>
angular1.api.plugin: null
angular1.api.prefix: api
angular1.api.extension: null
URL 公式
root + plugin/ + prefix/ + 'Any input' + .extension
您可以设置这些参数中的任何一个的新值
示例
发送到 APP/src/Controller/Api/AnyController.php→ownMethod()
1
(AppRoot/api/any/own-method
)
app.controller('any', function ($scope, $rootScope, api) {
api.get('any/own-method', function (response) {
var data = response.data;
});
api.post('any/own-method', {id:1}, function (response) {
var data = response.data;
});
});
2
(AppRoot/api/any/own-method.json
)
app.controller('any', function ($scope, $rootScope, api) {
angular1.api.extension = 'json';
api.get('any/own-method', function (response) {
var data = response.data;
});
angular1.api.extension = null;
});
3
(AppRoot/my-plugin/api/any/own-method
)
app.controller('any', function ($scope, $rootScope, api) {
angular1.api.plugin = 'my-plugin';
api.get('any/own-method', function (response) {
var data = response.data;
});
angular1.api.plugin = null;
});
所有 api
服务请求具有相同的配置。(js 变量 angular1.api
)
在 Angular 控制器结束时重置它们是一个好习惯
为了仅对当前请求方法进行一次配置更改,get()
和 post()
方法有额外的可选参数
插件、前缀、扩展
示例
1
(AppRoot/any/own-method.json
)
app.controller('any', function ($scope, $rootScope, api) {
api.get('any/own-method', function (response) {
var data = response.data;
}, undefined, null, 'json');
});
2
(AppRoot/my-plugin/api/any/own-method
)
app.controller('any', function ($scope, $rootScope, api) {
api.get('any/own-method', function (response) {
var data = response.data;
}, 'my-plugin');
});
注意!!! 在未定义参数的情况下,方法将使用 js 变量 angular1.api
的默认值
3
(AppRoot/my-plugin/api/any/own-method.xml
)
app.controller('any', function ($scope, $rootScope, api) {
angular1.api.plugin = 'my-plugin';
angular1.api.extension = 'xml';
api.get('any/own-method', function (response) {
var data = response.data;
});
angular1.api.plugin = null;
angular1.api.extension = null;
});
如果 URL 值为空(''
),则抛出控制台错误 Empty url