README

安装

安装此扩展的首选方法是使用 composer。

运行以下命令之一

php composer.phar require deesoft/yii2-angularjs "~1.0"

或者在您的 composer.json 文件的 require 部分添加

"deesoft/yii2-angularjs": "~1.0"

to

使用

模块小部件

文件 index.php

<div ng-app="angularYii">
    <?php Module::begin([
        'name' => 'angularYii', // module name, use for ng-app
        'controllers' => [
            'MainController' => [
                'sourceFile' => 'controllers/main-controller.js',
            ]
        ]
    ])?>
        <div ng-controller="MainController">
            <ul>
                <li ng-repeat="todo in todos">{{todo.name}}</li>
            </ul>
            <input ng-model="newValue"><button ng-click="addTodo()">Add</button>
        </div>
    <?php Module::end()?>
</div>

文件 controllers/main-controller.js

function($scope){
    $scope.todos = [
        {name: 'Satu'},
        {name: 'Dua'},
        {name: 'Tiga'},
    ];

    $scope.addTodo = function(){
        $scope.todos.push({
            name:$scope.newValue,
        });
        $scope.newValue = '';
    }
}

NgRoute 小部件

NgRoute 小部件是 Module 的特殊小部件。它有 routes 属性

文件 index.php

<div ng-app="ngrouteYii">
    <?= NgRoute::widget([
        'name' => 'ngrouteYii',
        'routes' => [
            '/' => [
                'templateFile' => 'templates/main.php',
                'controllerFile' => 'controllers/main.js',
            ],
            '/view/:id' => [
                'templateFile' => 'templates/view.php',
                'controllerFile' => 'controllers/view.js',
            ],
            '/edit/:id' => [
                'templateFile' => 'templates/edit.php',
                'controllerFile' => 'controllers/edit.js',
            ],
            '*' => [ // otherwise
                'templateFile' => 'templates/not-found.php',
            ],
        ]
    ])?>
</div>