Tag: angularjs

什么时候使用transclude'true'和transclude'element'在Angular中？

什么时候应该使用transclude: 'true'和transclude: 'element' ？ 我无法findtransclude: 'element'angulartransclude: 'element'中的transclude: 'element' ，他们很混乱。 如果有人能用简单的语言解释这个，我会很高兴。 每个选项有什么好处？ 他们之间真正的区别是什么？ 这是我发现的： transclude: true 在一个编译函数内部，你可以使用transclude链接函数来操纵DOM，或者你可以在任何HTML标签上使用ngTransclude指令将transcluded DOM插入到模板中。 和 transclude: 'element' 这样跨越了整个元素，并且在编译函数中引入了跨链接function。 您无法访问范围，因为范围尚未创build。 编译函数为可以访问作用域的指令创build一个链接函数，transcludeFn让您触摸DOM操作的克隆元素（被转移）或者使用绑定到作用域的数据。 对于您的信息，这是用于ng-repeat和ng-switch。

$ parse，$ interpolate和$ compile服务有什么区别？

$parse ， $interpolate和$compile服务有什么区别？ 对我来说，他们都做同样的事情：采取模板并将其编译为模板函数。

AngularJS：工厂和服务？

编辑2016年1月：由于这仍然得到关注。 既然问了这个问题，我已经完成了几个AngularJS项目，对于那些我主要使用factory ，build立了一个对象，最后返回了对象。 但是，下面的陈述仍然是正确的。 编辑：我想我终于明白了两者之间的主要区别，我有一个代码示例来演示。 我也认为这个问题是不同的build议重复。 重复说服务是不可实例化的，但是如果你按照我下面的演示来设置它，那实际上是这样的。 可以将服务设置为与工厂完全相同。 我还将提供代码，显示工厂故障转移服务，这似乎没有其他答案。 如果我像这样设置VaderService（即作为服务）： var module = angular.module('MyApp.services', []); module.service('VaderService', function() { this.speak = function (name) { return 'Join the dark side ' + name; } }); 然后在我的控制器中，我可以这样做： module.controller('StarWarsController', function($scope, VaderService) { $scope.luke = VaderService.speak('luke'); }); 使用服务，注入到控制器的VaderService被实例化，所以我可以调用VaderService.speak，但是如果我将VaderService更改为module.factory， 控制器中的代码将不再工作 ，这是主要区别。 在工厂中，注入到控制器中的VaderService 没有被实例化，这就是为什么在build立一个工厂时需要返回一个对象（参见我的示例）。 但是，您可以使用与build立工厂完全相同的方式来设置服务（IE会返回一个对象）， 并且服务的行为与工厂完全相同 有了这些信息，我没有理由使用工厂的服务，服务可以做一切工厂可以和更多。 下面的原始问题。 我知道这已经被问及时间的负载，但我真的不能看到工厂和服务之间的任何function差异。 我读过这个教程： http : […]

理解指令定义的transclude选项？

我认为这是我用angularjs的指令理解的最难的概念之一。 来自http://docs.angularjs.org/guide/directive的文件说： transclude – 编译元素的内容并使其可用于指令。 通常与ngTransclude一起使用。 转换的优点是链接函数接收到一个预先绑定到正确范围的转换函数。 在一个典型的设置中，小部件会创build一个隔离范围，但是该隔离不是一个孩子，而是隔离范围的一个兄弟。 这使小部件具有私有状态成为可能，并且将该跨部分绑定到父（预分离）范围。 真 – transclude该指令的内容。 “元素” – 涵盖整个元素，包括以较低优先级定义的任何指令。 它说ngTransclude通常与ngTransclude一起ngTransclude 。 但是ngTransclude文档中的示例根本不使用ngTransclude指令。 我想要一些很好的例子来帮助我理解这一点。 我们为什么需要它？ 它解决了什么问题？ 如何使用它？

用简单的数组init初始化ng选项

我有点和Angular和ng-options混淆。 我有一个简单的数组，我想用它初始化一个select。 但是，我想要的选项值=标签。 的script.js $scope.options = ['var1', 'var2', 'var3']; HTML <select ng-model="myselect" ng-options="o for o in options"></select> 我得到： <option value="0">var1</option> <option value="1">var2</option> <option value="2">var3</option> 我想要的是： <option value="var1">var1</option> <option value="var2">var2</option> <option value="var3">var3</option> 所以我试了一下： <select ng-model="myselect2" ng-init=0 ng-options="options[k] as v for (k,v) in options"></select> <select ng-model="myselect3" ng-init=0 ng-options="b as b for b in options"></select> （但它没有工作。） 编辑： 我的表单是外部提交的，这就是为什么我需要“var1”作为值而不是0。

使用逗号作为列表分隔符与AngularJS

我需要创build一个逗号分隔的项目列表： <li ng-repeat="friend in friends"> <b ng-repeat="email in friend.email">{{email}}{{$last ? '' : ', '}}</b>… </li> 根据AngularJS文档，在expression式中不允许控制stream程语句。 这就是为什么我的{{$last ? '' : ', '}} {{$last ? '' : ', '}}不起作用。 有没有其他的方法来创build逗号分隔列表？ 编辑1 有没有比这更简单的事情： <span ng-show="!$last">, </span>

AngularJS – $ destroy是否删除事件监听器？

https://docs.angularjs.org/guide/directive 通过监听此事件，可以删除可能导致内存泄漏的事件侦听器。 注册到范围和元素的监听器在被销毁时会被自动清理，但是如果您在服务上注册监听器，或者在没有被删除的DOM节点上注册监听器，则必须自己清理它，或者你冒险引入内存泄漏。 最佳实践：指令应该自行清理。 您可以使用element.on（'$ destroy'，…）或作用域。$ on（'$ destroy'，…）在删除指令时运行清理函数。 题： 我有一个element.on "click", (event) ->在我的指令里面： 当指令被破坏时，有没有对element.on内存引用来防止被垃圾收集？ Angular文档指出我应该使用一个处理程序来移除$destroy发送的事件上的事件侦听器。 我的印象是， destroy()删除事件监听器，是不是这样的情况？

AngularJS文件夹结构

如何为一个大型的可扩展的AngularJS应用程序devise一个文件夹结构？

显示popup窗口最优雅的方式

我有这个AngularJS应用程序。 一切正常。 现在，当特定的条件变成真实时，我需要显示不同的popup窗口，我想知道什么是最好的进行方式。 目前我正在评估两个选项，但我完全开放其他选项。 选项1 我可以为popup窗口创build新的HTML元素，并直接从控制器追加到DOM。 这将打破MVCdevise模式。 我对这个解决scheme不满意。 选项2 我总是可以在静态HTML文件中插入所有popup窗口的代码。 然后，使用ngShow ，我可以隐藏/只显示正确的popup窗口。 这个选项不是真的可扩展的。 所以我很确定要有一个更好的方法来实现我想要的。

单击表单中的button会刷新页面

我有一个在Angular中有两个button标签的表单。 一个button在ng-click上提交表单。 另一个button纯粹是用ng-click导航的。 但是，当第二个button被点击时，AngularJS会导致一个页面刷新，触发一个404。我在这个函数中放了一个断点，它正在触发我的函数。 如果我执行以下任一操作，则停止： 如果我删除ng-click ，该button不会导致页面刷新。 如果我注释掉函数中的代码，它不会导致页面刷新。 如果我将button标签更改为带有href=""的锚定标签（ <a> ），则不会导致刷新。 后者似乎是最简单的解决方法，但为什么AngularJS甚至在我的函数之后运行任何代码，导致页面重新加载？ 看起来像一个错误。 这里是表格： <form class="form-horizontal" name="myProfile" ng-switch-when="profile"> <fieldset> <div class="control-group"> <label class="control-label" for="passwordButton">Password</label> <div class="controls"> <button id="passwordButton" class="secondaryButton" ng-click="showChangePassword()">Change</button> </div> </div> <div class="buttonBar"> <button id="saveProfileButton" class="primaryButton" ng-click="saveUser()">Save</button> </div> </fieldset> </form> 这里是控制器的方法： $scope.showChangePassword = function() { $scope.selectedLink = "changePassword"; };