仅在完成父事件时才执行Angular指令

Question

我有一个指令，如果我像属性标签一样使用它。现在，我要执行它，只有完成控制器中的表单验证。

我的指示代码是：

myApp.directive('myDirective', function ($location) {
'use strict';
return {
  restrict: 'A',
  replace: false,
  scope: {
    'myDirective': '@'
  },
  link: function ($scope, $element, $attrs) {
    initialize();
    /* initialize -
     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
    function initialize() {
        createEventListeners();
    }
    /* createEventListeners -
     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
    function createEventListeners() {
      // listen for a click
      $element.on('click', function () {
        // set the hash like a normal anchor scroll
        $location.hash($scope.myDirective);
        // smooth scroll to the passed in element
        scrollTo($scope.myDirective);
      });
    }.... etc.

我的html是：

<button class="btn btn-default btn-lg btn-step" data-my-directive="ats" data-ng-click="stepone.$valid && saveStepOne()" type="submit">Next</button>

该指令用于平滑滚动到页面上的某个锚点...
和data-my-directive='ats'实际上只是添加URL bar #ats并开始滚动。但是我的想法是：

我只想在" stepone"有效并保存时才开始滚动。

Answer 1

您可以使用ng-if。

<div ng-if="isParentDone">
  <div my-directive....>

ng-if实际上会将/删除HTML元素添加到DOM，因此您的初始化函数仅在创建实际创建时才会调用。

Sidenote：我看到您有一个$element.on('click')。您确实应该使用ng-click。