Question

我是angularjs的新手，我可能错过了很多概念。我正在尝试为我的应用程序创建一个模态指令，有些东西让我烦恼，它就是如何与该指令进行交互。

我正在使用yeoman，我使用：

生成模态指令

yo angular:directive modal --coffee

所以我在我的指令目录中有这个代码：

angular.module('myApp')
  .directive('modal', () ->
    templateUrl: 'views/partials/modal.html'
    restrict: 'E'
    link: (scope, element, attrs) ->
      console.log 'link --test'
  )

现在在我的modal.html部分中，我插入了一个锚标记来处理点击并提醒我一些事情。

<div><a href="" ng-click="foo()">Click Me</a></div>

现在我在哪里放置foo功能？

我试过这样的事但没有运气

angular.module('myApp')
  .directive('modal', () ->
    templateUrl: 'views/partials/modal.html'
    restrict: 'E'
    link: (scope, element, attrs) ->
      console.log 'link --test'
    controller: ($scope) ->
       $scope.foo = () ->
         console.log 'clicked that anchor'
  )

另一个问题，我做得对，我的意思是创建一个模态指令是正确的吗？或指令以不同的方式使用？

Answer 1

在指令控制器中放置foo()效果很好。你走在正确的轨道上。指令是Angular中建议进行DOM操作的地方 - 因此模态对话框是指令的一个很好的用例。

确保你的html初始化Angular并使用如下指令：

<div ng-app="myApp">
    <modal></modal>
</div>

这是使用你的代码加上上面的html的working fiddle（为了简单起见，我直接使用了模板）。

创建一个模态指令，并在角度js中绑定它上面的click事件

1 个答案: