草庐IT

javascript - AngularJS:指令与 Controller - 什么逻辑放在哪里？

coder 2024-05-10 原文

关闭。这个问题是opinion-based .它目前不接受答案。












想改进这个问题？更新问题，以便 editing this post 可以用事实和引用来回答它.


8年前关闭。







Improve this question




我对 Angular 很陌生，并尝试真正学习如何组织我的代码，因此 future 的同事将能够快速找到解决方法。

我知道的一条规则是“如果它操纵 DOM，请将其放入指令中”，我遵守了这一规则。

但是有时我不确定将我的方法放在哪里，因为我可以将它们放入主应用程序 Controller 中，放入作为指令中“ Controller ”选项提供的 Controller 中，甚至在初始化指令的函数中(选项“关联”)。

使用过滤器和服务对我来说很清楚，但是使用 Controller 和指令时，这条线变得非常模糊。
我已经意识到，即使使用一个小应用程序，我也会到处散布一些代码，这已经令人困惑，甚至对我自己也是如此。所以我想获得一些关于更好地组织我的代码的提示。

所以我想我的主要问题是:
1) 是否有一个好的经验法则可以知道将哪些代码放在哪里？

或者如果这太抽象了，这里有一些例子:
2)我有一个模板指令，我只在我的应用程序中使用。当我单击元素时，应该会发生一些事情。我已经知道使用 ng-click 指令优于在链接函数中绑定(bind)点击事件。
但是我应该在哪里定义 ng-click 中提供的方法？

  • A) 应用程序的主 Controller 。
  • B) 指令的“链接”功能。
  • C) 将 Controller 添加到指令中(使用“ Controller ”选项)并在那里定义它。

    • 3) 如果我打算在其他地方重用该指令，2) 的答案会有所不同吗？

    4)不同的场景:
    我有一个按钮，当单击并拖动它时，它应该移动一个完全不相关的元素。
    我是不是该...
  • A)创建一个指令并根据传递的属性影响模板和行为？
  • B) 创建两个指令(一个用于句柄，一个用于目标元素)
    如果是这样，它再次提出了将处理拖动的方法放在哪里的问题？

    • 笔记:
    我知道答案可能有点取决于个人意见，但我有点希望有一些“规则”或“正确的方法”，我可以在 future 的发展中遵守这些规则。
    出于简洁的原因，我没有包含任何代码。
    如果需要答案，我很乐意提供。

    感谢您的时间。

    最佳答案

    首先，很好的问题。我认为每个新的 Angular 开发人员都在与所有给定组件( Controller 、指令、服务、过滤器等)的差异作斗争。

    让我们从基本的正式定义开始:

    Directives are markers on a DOM element that tell AngularJS's HTML compiler to attach a specified behavior to that DOM element.



    另一方面

    Controller is a JavaScript constructor function that is used to augment the Angular Scope



    定义的行为确实引导我们通过一些经验法则。

    所以对于你上面的问题:
  • 简单来说，我们使用 Controller 来管理一个区域(范围)
    具有 Controller 带来的所有强大功能的 HTML 模板
    (双向绑定(bind)、作用域行为、服务注入(inject)等)我们
    当我们希望操作现有的 HTML 元素或
    在大多数情况下自定义自己的 - 当我们考虑重用时
    这个元素。
  • 这取决于 ng-click 应该做什么的上下文。假设您有一个数字输入的自定义指令，该指令具有您在指令配置中定义的自定义设计和行为。并且您以 ng-click 假设弹出具有可选值的模式并在应用程序中的不同位置使用它的形式使用它，而 ng-click 将执行其他操作。在这种情况下，函数需要是 scope.fucntion。但是假设位置和其他所有位置都将完全相同，这会将函数带到指令范围。
  • 上面回答:)
  • 你的每一个选择都可以，这就是“意见”和较少的经验法则存在的地方。为什么？因为当各有利弊时，这两种方法都会起作用。我可以在场景中找到的经验法则是，如果两个元素都是指令模板的一部分，我希望“行为”(拖动功能)成为指令范围的一部分。

    • 祝你好运

    关于javascript - AngularJS:指令与 Controller - 什么逻辑放在哪里？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24761331/

    javascriptControllerbrsectionangularjs

    有关javascript - AngularJS:指令与 Controller - 什么逻辑放在哪里？的更多相关文章

    1. ruby - 为什么我可以在 Ruby 中使用 Object#send 访问私有(private)/ protected 方法？ - 2

      类classAprivatedeffooputs:fooendpublicdefbarputs:barendprivatedefzimputs:zimendprotecteddefdibputs:dibendendA的实例a=A.new测试a.foorescueputs:faila.barrescueputs:faila.zimrescueputs:faila.dibrescueputs:faila.gazrescueputs:fail测试输出failbarfailfailfail.发送测试[:foo,:bar,:zim,:dib,:gaz].each{|m|a.send(m)resc

    2. ruby-on-rails - Rails - 子类化模型的设计模式是什么？ - 2

      我有一个模型:classItem项目有一个属性“商店”基于存储的值，我希望Item对象对特定方法具有不同的行为。Rails中是否有针对此的通用设计模式？如果方法中没有大的if-else语句，这是如何干净利落地完成的？ 最佳答案 通常通过Single-TableInheritance. 关于ruby-on-rails-Rails-子类化模型的设计模式是什么？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.co

    3. ruby - 什么是填充的 Base64 编码字符串以及如何在 ruby​​ 中生成它们？ - 2

      我正在使用的第三方API的文档状态:"[O]urAPIonlyacceptspaddedBase64encodedstrings."什么是“填充的Base64编码字符串”以及如何在Ruby中生成它们。下面的代码是我第一次尝试创建转换为Base64的JSON格式数据。xa=Base64.encode64(a.to_json) 最佳答案 他们说的padding其实就是Base64本身的一部分。它是末尾的“=”和“==”。Base64将3个字节的数据包编码为4个编码字符。所以如果你的输入数据有长度n和n%3=1=>"=="末尾用于填充n%

    4. ruby - 解析 RDFa、微数据等的最佳方式是什么，使用统一的模式/词汇(例如 schema.org)存储和显示信息 - 2

      我主要使用Ruby来执行此操作，但到目前为止我的攻击计划如下:使用gemsrdf、rdf-rdfa和rdf-microdata或mida来解析给定任何URI的数据。我认为最好映射到像schema.org这样的统一模式，例如使用这个yaml文件，它试图描述数据词汇表和opengraph到schema.org之间的转换:#SchemaXtoschema.orgconversion#data-vocabularyDV:name:namestreet-address:streetAddressregion:addressRegionlocality:addressLocalityphoto:i

    5. ruby-on-rails - 渲染另一个 Controller 的 View - 2

      我想要做的是有2个不同的Controller，client和test_client。客户端Controller已经构建，我想创建一个test_clientController，我可以使用它来玩弄客户端的UI并根据需要进行调整。我主要是想绕过我在客户端中内置的验证及其对加载数据的管理Controller的依赖。所以我希望test_clientController加载示例数据集，然后呈现客户端Controller的索引View，以便我可以调整客户端UI。就是这样。我在test_clients索引方法中试过这个:classTestClientdefindexrender:template=>

    6. ruby - 为什么 4.1%2 使用 Ruby 返回 0.0999999999999996？但是 4.2%2==0.2 - 2

      为什么4.1%2返回0.0999999999999996？但是4.2%2==0.2。 最佳答案 参见此处:WhatEveryProgrammerShouldKnowAboutFloating-PointArithmetic实数是无限的。计算机使用的位数有限(今天是32位、64位)。因此计算机进行的浮点运算不能代表所有的实数。0.1是这些数字之一。请注意，这不是与Ruby相关的问题，而是与所有编程语言相关的问题，因为它来自计算机表示实数的方式。 关于ruby-为什么4.1%2使用Ruby返

    7. ruby-on-rails - Rails 应用程序中的 Rails : How are you using application_controller. rb 是新手吗？ - 2

      刚入门rails，开始慢慢理解。有人可以解释或给我一些关于在application_controller中编码的好处或时间和原因的想法吗？有哪些用例。您如何为Rails应用程序使用应用程序Controller？我不想在那里放太多代码，因为据我了解，每个请求都会调用此Controller。这是真的？ 最佳答案 ApplicationController实际上是您应用程序中的每个其他Controller都将从中继承的类(尽管这不是强制性的)。我同意不要用太多代码弄乱它并保持干净整洁的态度，尽管在某些情况下ApplicationContr

    8. ruby-on-rails - rails : How to make a form post to another controller action - 2

      我知道您通常应该在Rails中使用新建/创建和编辑/更新之间的链接，但我有一个情况需要其他东西。无论如何我可以实现同样的连接吗？我有一个模型表单，我希望它发布数据(类似于新View如何发布到创建操作)。这是我的表格prohibitedthisjobfrombeingsaved: 最佳答案 使用:url选项。=form_for@job,:url=>company_path,:html=>{:method=>:post/:put} 关于ruby-on-rails-rails:Howtomak

    9. ruby - ruby 中的 TOPLEVEL_BINDING 是什么？ - 2

      它不等于主线程的binding，这个toplevel作用域是什么？此作用域与主线程中的binding有何不同？>ruby-e'putsTOPLEVEL_BINDING===binding'false 最佳答案 事实是，TOPLEVEL_BINDING始终引用Binding的预定义全局实例，而Kernel#binding创建的新实例>Binding每次封装当前执行上下文。在顶层，它们都包含相同的绑定(bind)，但它们不是同一个对象，您无法使用==或===测试它们的绑定(bind)相等性。putsTOPLEVEL_BINDINGput

    10. ruby - Infinity 和 NaN 的类型是什么？ - 2

      我可以得到Infinity和NaNn=9.0/0#=>Infinityn.class#=>Floatm=0/0.0#=>NaNm.class#=>Float但是当我想直接访问Infinity或NaN时:Infinity#=>uninitializedconstantInfinity(NameError)NaN#=>uninitializedconstantNaN(NameError)什么是Infinity和NaN？它们是对象、关键字还是其他东西？ 最佳答案 您看到打印为Infinity和NaN的只是Float类的两个特殊实例的字符串

    随机推荐