如何在YII 2.0框架中使用angualrjs作为前端?

时间:2015-05-28 14:08:54

标签: javascript angularjs yii

我是新手学习angularjs,我想使用 angularjs 作为 YII 2.0 的前端。

我用谷歌搜索但没有找到任何解决方案,对不起,如果有人问同样的问题。

使用高级应用YII 2.0 我已将angular.min.js和angular-resource.min.js添加到rootproject / frontend / assets / AppAsset.php

public $js = [
'assets/angularjavascript/angular.min.js',
'assets/angularjavascript/angular-resource.min.js',
];

index.php文件

<html  data-ng-app=""> 
<head>

</head> 
<body> 

    <div ng-app="myApp" ng-controller="customersCtrl">

        <table>
          <tr ng-repeat="x in names">
            <td>{{ x.Name }}</td>
            <td>{{ x.Country }}</td>
          </tr>
        </table>

    </div>

    <script>
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', function($scope, $http) {
       $http.get("http://www.w3schools.com/angular/customers_mysql.php")
       .success(function (response) {$scope.names = response.records;});
    });
    </script>


</body>
</html>

错误:

ReferenceError: angular is not defined
var app = angular.module('myApp', []);
Error: [$injector:modulerr]     http://errors.angularjs.org/1.3.15/$injector/modulerr?p0=myApp&p1=%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.3.15%2F%24injector%2Fnomod%3Fp0%3DmyApp%0AR%2F%3C%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A6%3A417%0AOd%2F%3C%2F%3C%2F%3C%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A21%3A412%0Aa%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A21%3A53%0AOd%2F%3C%2F%3C%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A21%3A1%0Ag%2F%3C%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A35%3A46%0Ar%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A7%3A300%0Ag%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A34%3A399%0Aab%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A38%3A135%0Auc%2Fd%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A17%3A381%0Auc%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A18%3A179%0AJd%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A17%3A1%0A%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fangularjavascript%2Fangular.min.js%3A250%3A429%0AjQuery.Callbacks%2Ffire%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fa462caba%2Fjquery.js%3A3094%3A10%0AjQuery.Callbacks%2Fself.fireWith%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fa462caba%2Fjquery.js%3A3206%3A7%0A.ready%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fa462caba%2Fjquery.js%3A3412%3A1%0Acompleted%40http%3A%2F%2Flocalhost%2Fyii__project%2Fadvanced%2Ffrontend%2Fweb%2Fassets%2Fa462caba%2Fjquery.js%3A3428%3A2%0A  

提前感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

对不起如果我问过愚蠢的问题,但作为对角度js的新手,我没有找到任何答案。现在了解它的功能。

实际上我正在搜索如何将本地 angular.js 包含到YII 2.0框架中,我自己做了,Vineet也是对的。

需要包含angular.js文件或网站每个页面的布局。

将其包含在布局文件的head标记中。

<script src="/root/yourjs_folder/angular.min.js"></script>

这可以帮助可能遇到同样问题的人。

再次感谢。