初学angularJS 个人总结 & 错误排除

最新推荐文章于 2022-05-12 15:39:24 发布

原创最新推荐文章于 2022-05-12 15:39:24 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

原创同时被 3 个专栏收录

65 篇文章

订阅专栏

Web

9 篇文章

订阅专栏

AngularJS

2 篇文章

订阅专栏

本文总结了初学者在学习AngularJS时遇到的常见问题，包括VS中出现的“无效字符”错误，该错误由于Angular-csp.css被误识别为js导致，解决方法是将其移到Content文件夹；另外，还提到了两个JS错误，一个是语法错误，通过在'enron'后面添加', [ ]'来解决，另一个是直接删除routeParams以修复问题。" 53940894,5635958,SurfaceView崩溃解析与解决策略,"['Android开发', 'Android基础知识', 'UI编程', 'SurfaceView']

------------ * 个人总结 * ------------

主要参考物：

跟着 http://www.w3cschool.cc/angularjs/ 学

通过VS 来实操，学 http://www.dotblogs.com.tw/mantou1201/archive/2014/05/15/145117.aspx

和勇哥的 DpMngWebsite

最后有关表格的部分可以参考 http://www.itstrike.cn/Question/cc54371f-3d10-475e-9d07-3047892ff275.html

------------ * 错误排除 * ------------

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;
    }
}]);