Tag: angularjs
在不同的元素上使用相同的控制器来引用同一个对象
我想如果我掌握ng-controller="GeneralInfoCtrl"在我的DOM中的多个元素，他们将共享相同的$scope （或至less双向绑定不工作）。 我想这样做的原因是因为我在HTML的不同部分有不同的只读视图和相关的modal dialog，并且它们不共享一个共同的祖先（除<body>和<html> ）。 有没有办法让两个控制器引用相同的对象/使其之间的数据绑定工作？ 以下是一些坚持使用Jade编写标记的代码： .client-box(ng-controller="GeneralInfoCtrl") .box-header .box-title h5 General Information .box-buttons button.btn.btn-small(data-target='#editGeneralInfo', data-toggle='modal', data-backdrop='static') <i class="icon-pencil"></i> Edit .box-body table.table.table-tight.table-key-value tr th Name td {{client.fullName()}} tr th Also Known As td {{client.aka}} tr th Birth Date td {{client.birthDate|date:'mediumDate'}} … #editGeneralInfo.modal.hide.fade(ng-controller="GeneralInfoCtrl") .modal-header button.close(type='button', data-dismiss='modal') × h3 Edit General Information .modal-body form.form-horizontal.form-condensed .control-group label.control-label First […]
在Angular JS中使用$ timeout而不是window.setTimeout有什么好处？
我有一个build议来实现这样的超时： $timeout(function() { // Loadind done here – Show message for 3 more seconds. $timeout(function() { $scope.showMessage = false; }, 3000); }, 2000); }; 有人能告诉我什么是使用这个，而不是使用setTimeout的原因/优势？
你可以随时更改templateUrl吗？
是否可以通过在指令的作用域中传递值来即时更改templateUrl？ 我想传递数据到控制器，将呈现基于从指令传递的数据的页面 可能是这样的： <div> <boom data="{{myData}}" /> </div> .directive('boom', function { return { restrict: 'E', transclude: true, scope: 'isolate', locals: { data: 'bind' }, templateUrl: "myTemplate({{boom}}})" // <- that of course won't work. } });
内容types不是用$ http发送的
Angular没有添加正确的内容types选项，我尝试了下面的命令： $http({ url: "http://localhost:8080/example/teste", dataType: "json", method: "POST", headers: { "Content-Type": "application/json" } }).success(function(response){ $scope.response = response; }).error(function(error){ $scope.error = error; }); 上面的代码生成以下http请求： POST http://localhost:8080/example/teste HTTP/1.1 Host: localhost:8080 Connection: keep-alive Content-Length: 0 Cache-Control: no-cache Pragma: no-cache Origin: http://localhost:8080 User-Agent: Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.64 Safari/537.31 Content-Type: application/xml Accept: application/json, text/plain, */* […]
angularjs路由可以有可选的参数值吗？
我可以使用可选的参数（相同的模板和控制器）来设置路由，但是如果不存在，应该忽略一些参数？ 那么不要写下面的两条规则，只有一条规则？ module.config(['$routeProvider', function($routeProvider) { $routeProvider. when('/users/', {templateUrl: 'template.tpl.html', controller: myCtrl}). when('/users/:userId', {templateUrl: 'template.tpl.html', controller: myCtrl}) }]); 像这样的东西（[这个参数是可选的]） when('/users[/:userId]', {templateUrl: 'template.tpl.html', controller: myCtrl}) //note: this previous doesn't work 我在他们的文档中找不到任何东西。
AngularJS集团指令没有外部依赖
我是Angular的新手，想要学习处理问题的最佳方法。 我的目标是有一个可重用的手段来创build组头。 我创build了一个解决scheme，但我认为这应该是一个指令，而不是在我的控制器范围function，但我不知道如何做到这一点，或者如果指令是正确的路要走。 任何投入将不胜感激。 看看我目前的做法在jsFiddle上工作 在HTML中，这是一个使用ng-repeat的简单列表，我在ng-show上调用了我的newGrouping（）函数。 该函数将一个引用传递给完整列表，我想要分组的字段以及当前索引。 <div ng-app> <div ng-controller='TestGroupingCtlr'> <div ng-repeat='item in MyList'> <div ng-show="newGrouping($parent.MyList, 'GroupByFieldName', $index);"> <h2>{{item.GroupByFieldName}}</h2> </div> {{item.whatever}} </div> </div> </div> 在我的控制器中，我有我的newGrouping（）函数，只是比较当前和前一个，除了第一个项目，并返回true或false取决于匹配。 function TestGroupingCtlr($scope) { $scope.MyList = [ {GroupByFieldName:'Group 1', whatever:'abc'}, {GroupByFieldName:'Group 1', whatever:'def'}, {GroupByFieldName:'Group 2', whatever:'ghi'}, {GroupByFieldName:'Group 2', whatever:'jkl'}, {GroupByFieldName:'Group 2', whatever:'mno'} ]; $scope.newGrouping = function(group_list, group_by, index) { if […]
AngularJS HTML5模式 – 直接链接如何在没有服务器特定变化的情况下工作？
注意：这个问题也可以这样写： 如何在Java中支持hashbang-less客户端mvc框架的书签。 我正在转换一个angular度的应用程序，使用hashtags html5mode 。 我已经成功设置 $locationProvider.html5Mode(true); 所有来自login页面（index.html）的链接都可以正常工作。 问题是，如果直接引用部分url，我自然会得到一个404，因为服务器端点定义没有耦合到客户端定义的路由。 因此，如果没有HTML5，我们会获得非SEO友好的hashbangs，但是对于其他目标网页（bootstrapsangular色的页面），我们不能添加书签。 为什么如果首先请求默认login页面（index.html），即htpp：//mydomain.com/： 浏览器从服务器请求index.html 服务器返回index.html，浏览器加载angular度框架 URL更改发送到客户端路由器，并加载正确的部分。 为什么它不工作，如果（即）直接从浏览器请求http://mydomain.com/foo ： 浏览器从服务器请求mydomain / foo。 资源不存在 服务器返回404 这个故事中缺less的东西，我只是不知道。 这是我能看到的唯一的两个答案 这是devise。 这是应该如何工作？ 用户必须始终登陆客户端MVC框架的引导页面（通常是index.html），然后从那里导航。 这是不理想的，因为国家不能保存，没有办法书签…更不用说抓取。 服务器scheme。 这是一个服务器端技巧解决？ 例如，在所有的请求中，返回index.html并立即调用具有额外上下文的路由器。 如果是这样，这是违背AngularJS完全客户端的目标，并且看起来像一个黑客攻击。
如何使用ng-pattern在angularJs中validation电子邮件ID
我正尝试使用ng-pattern指令来validationangularJs中的电子邮件ID字段。 但是AngularJs是新的。 当用户input错误的电子邮件ID时，我需要显示一条错误消息。 我下面的代码正在努力解决。 帮助我使用ng-pattern获得正确的结果。 <script type="text/javascript" src="/Login/script/ang.js"></script> <script type="text/javascript"> function Ctrl($scope) { $scope.text = 'enter email'; $scope.word = /^[az]+[a-z0-9._]+@[az]+\.[az.]{2,5}$/; } </script> </head> <body> <form name="myform" ng-controller="Ctrl"> <input type="text" ng-pattern="word" name="email"> <span class="error" ng-show="myform.email.$error.pattern"> invalid email! </span> <input type="submit" value="submit"> </form> </body>
我如何testingangular度的事件？
我需要testing事件得到正确发射或广播，并手动触发事件。 什么是最好的方法来做到这一点？
Angular Js和google api client.js（gapi）
我花了一天的时间才做到这一点，所以我觉得我的经验可能对某人有用。 也许其他一些人会发现改善。 所以我两天前开始使用angularJS。 我希望它可以与Google Cloud Endpoints一起使用来创build后端界面。 这给我带来了麻烦。 gapi的javascript客户端来自asynchronous加载，所以angular度初始化将崩溃gapi未定义。 所以当gapi被初始化时，你需要引导angular度： 删除ng-app =“myApp” 添加<script src="https://apis.google.com/js/client.js?onload=googleOnLoadCallback"></script> 添加callback： function googleOnLoadCallback(){ var apisToLoad = 1; // must match number of calls to gapi.client.load() var gCallback = function() { if (–apisToLoad == 0) { //Manual bootstraping of the application var $injector = angular.bootstrap(document, ['myApp']); console.log('Angular bootstrap complete ' + gapi); }; […]
