初學angularJS 個人總結 & 錯誤排除

jodies發表於2015-02-27
AngularJS
------------ *  個人總結 * ------------
主要參考物：
和 勇哥的 DpMngWebsite

------------ *  錯誤排除 * ------------
C#:
public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/AngularJs").Include(
                "~/Scripts/angular.js", "~/Scripts/angular*"));

Aspx:

<html lang="en" ng-app="enron">
<head runat="server">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title><%: Page.Title %></title>
    
    <asp:PlaceHolder runat="server">
        <%: Scripts.Render("~/bundles/AngularJs") %>
        <%: Scripts.Render("~/bundles/modernizr") %>
    </asp:PlaceHolder>

錯誤：VS蹦出錯誤：“無效的字元” 並且顯示Angular-csp.css

解決：學習了http://stackoverflow.com/questions/26916671/angular-csp-css-breaking-in-chrome-extension之後，將angular-csp.css移出了Scripts的資料夾，並放入了Content資料夾。有錯誤是因為CSS檔案被VS當成js讀了。

------------------------------------

JS:

angular.module('enron').controller('NameListController', ['$rootScope', '$scope', '$routeParams', '$http', function ($rootScope, $scope, $routeParams, $http) {
    $scope.sayhello = function () {
        alert('hello'); return;
    }
}]);

錯誤：

Angularjs module isn't loading correctly

解決：在 'enron' 後面加 ', [ ] '

angular.module('enron',[]).controller('NameListController', ['$rootScope', '$scope', '$http', function ($rootScope, $scope, $http) {
    $scope.sayhello = function () {
        alert('hello'); return;
    }
}]);

------------------------------------

JS:

angular.module('enron',[]).controller('NameListController', ['$rootScope', '$scope', '$routeParams', '$http', function ($rootScope, $scope, $routeParams, $http) {
    $scope.sayhello = function () {
        alert('hello'); return;
    }
}]);

錯誤：

Error: [$injector:unpr] Unknown provider: routeParamsProvider <- routeParams

解決：直接刪除 routeParams

angular.module('enron',[]).controller('NameListController', ['$rootScope', '$scope', '$http', function ($rootScope, $scope, $http) {
    $scope.sayhello = function () {
        alert('hello'); return;
    }
}]);


相關文章