Tag: angularjs

什么是ng-include的正确语法？: 我试图在一个ng-repeat包含一个HTML代码片段，但是我无法让这个include工作。看来ng-include的当前语法与之前的不同：我看到很多使用的例子 <div ng-include src="path/file.html"></div> 但在官方文件中，它说使用 <div ng-include="path/file.html"></div> 但是，然后下面的页面显示为 <div ng-include src="path/file.html"></div> 无论如何，我尝试过 <div ng-include="views/sidepanel.html"></div> <div ng-include src="views/sidepanel.html"></div> <ng-include src="views/sidepanel.html"></ng-include> <ng-include="views/sidepanel.html"></ng-include> <ng:include src="views/sidepanel.html"></ng:include> 我的代码片段不是很多代码，但有很多事情要做。我读dynamic加载模板内ng-repeat ，这可能会导致一个问题，所以我用fooreplacesidepanel.html的内容，仍然没有。我也尝试直接在页面中声明模板，如下所示： <script type="text/ng-template" id="tmpl"> foo </script> 并且运行ng-include所有变体引用脚本的id ，但是什么都没有。我的网页有更多的，但现在我已经把它剥离到这一点： <!– index.html –> <html> <head> <!– angular includes –> </head> <body ng-view="views/main.html"> <!– view is actually set in the […]

部分和模板的复杂嵌套: 我的问题涉及如何在AngularJS应用程序中处理复杂的模板嵌套（也称为partials ）。描述我的情况的最好方法是用我创build的图像：正如你所看到的，这有可能是一个相当复杂的应用程序与大量的嵌套模型。该应用程序是单页面的，所以它加载了一个index.html ，在DOM中包含一个div元素，并带有ng-view属性。对于圆1 ，您会看到有一个Primary导航可以将相应的模板加载到ng-view 。我通过传递$routeParams到主应用程序模块来做到这一点。这里是我的应用程序中的一个例子： angular.module('myApp', []). config(['$routeProvider', function($routeProvider) { $routeProvider. when("/job/:jobId/zones/:zoneId", { controller: JobDetailController, templateUrl: 'assets/job_list_app/templates/zone_edit.html' }). when("/job/:jobId/initial_inspection", { controller: JobDetailController, templateUrl: 'assets/job_list_app/templates/initial_inspection.html' }). when("/job/:jobId/zones/:zoneId/rooms/:roomId", { controller: JobDetailController, templateUrl: 'assets/job_list_app/templates/room_edit.html' }) }]); 在循环2中，加载到ng-view的模板有一个额外的子导航。这个子导航然后需要加载模板到它下面的区域 – 但由于ng-view已被使用，我不知道如何去做这个。我知道我可以在第一个模板中包含额外的模板，但是这些模板将会非常复杂。我想保留所有的模板分开，以使应用程序更容易更新，而不是必须加载为了访问其子的父模板的依赖。在第3圈，你可以看到事情变得更加复杂。子导航模板可能会有第二个子导航，需要将自己的模板加载到圆圈4的区域如何构build一个AngularJS应用程序来处理如此复杂的模板嵌套，同时保持它们之间的相互独立？

Polymer元素和AngularJS指令有什么区别？: 在“聚合物使用入门”页面中，我们看到聚合物的实例： <html> <head> <!– 1. Shim missing platform features –> <script src="polymer-all/platform/platform.js"></script> <!– 2. Load a component –> <link rel="import" href="x-foo.html"> </head> <body> <!– 3. Declare the component by its tag. –> <x-foo></x-foo> </body> </html> 你会注意到<x-foo></x-foo>是由platform.js和x-foo.html定义的。看起来这和AngularJS中的指令模块是等价的： angular.module('xfoo', []) .controller('X-Foo', ['$scope',function($scope) { $scope.text = 'hey hey!'; }) .directive('x-foo', function() { return { restrict: 'EA', replace: […]

为什么AngularJS在select中包含一个空的选项？: 在过去的几个星期里，我一直在和AngularJS合作，而真正困扰我的是，即使在http://docs.angularjs.org/api/ng尝试了所有的排列或规范中定义的configuration之后， .directive：select ，我仍然得到一个空选项作为select元素的第一个子元素。这是玉： select.span9(ng-model='form.type', required, ng-options='option.value as option.name for option in typeOptions'); 这里的控制器： $scope.typeOptions = [ { name: 'Feature', value: 'feature' }, { name: 'Bug', value: 'bug' }, { name: 'Enhancement', value: 'enhancement' } ]; 最后，这里是生成的HTML： <select ng-model="form.type" required="required" ng-options="option.value as option.name for option in typeOptions" class="span9 ng-pristine ng-invalid ng-invalid-required"> <option value="?" selected="selected"></option> <option […]

如果在AngularJS模板中的其他语句: 我想在AngularJS模板中做一个条件。我从Youtube API获取video列表。部分video比例为16：9，部分video比例为4：3。我想要这样一个条件： if video.yt$aspectRatio equals widescreen then element's attr height="270px" else element's attr height="360px" 我使用ng-repeat迭代video。不知道该怎么办这个情况：在范围中添加一个函数？在模板中做？

angular-route和angular-ui-router有什么区别？: 我打算在我的大型应用程序中使用AngularJS。所以我正在找出正确的模块来使用。 ngRoute（angular-route.js）和ui-router（angular-ui-router.js）模块有什么区别？在使用ngRoute的许多文章中，路由configuration了$ routeProvider 。然而，当与UI路由器一起使用时，路由configuration$ stateProvider和$ urlRouterProvider 。我应该使用哪个模块来获得更好的可pipe理性和可扩展性？

我如何有条件地要求AngularJS的表单input？: 假设我们正在用AngularJS构build一个地址簿应用程序（人为的例子）。我们有一个联系人表单，用于input电子邮件和电话号码，我们希望要求一个或另一个，但不是两个：我们只希望emailinput是必需的，如果phoneinput是空的或无效的，反之亦然。 Angular有一个required指令，但在这种情况下，文档中不清楚如何使用它。那么我们如何有条件地要求一个表单域呢？写一个自定义指令？

否则，在StateProvider上: 使用angular-ui-router，我怎样才能使用$ stateProvider的其他方法，或者我怎样才能使用它呢？

href重写ng-click在Angular.js中: 当同时定义href和ng-click属性时： <a href="#" ng-click="logout()">Sign out</a> href属性优先于ng-click。我正在寻找一种方法来提高ng-click的优先级。 Twitter Bootstrap需要href ，我无法删除它。

在Angular中处理Accordion的打开/折叠事件: 如果我有这个代码： <accordion-group heading="{{group.title}}" ng-repeat="group in groups"> {{group.content}} </accordion-group> 使用AngularJS，angular-ui和Twitter Bootstrap，可以在打开时让手风琴调用一些动作吗？我知道我不能简单地添加ng-click ，因为在“编译”为HTML来打开/折叠组之后已经使用了。