Question

在角度1.5x和2中应用更改后，在哪里做某些事情？

（请给我两个版本的答案）

例如，让我们看看这个片段：

＆＃13;

angular.module('app', []);

angular
 .module('app')
 .component('test', {
    controller: TestComponent,
    template: '' +
     '<button ng-click="$ctrl.switchTab()">Switch tab</button>' +
     '<div class="tab1" ng-if="$ctrl.tab === 1">tab 1</div>' +
     '<div class="tab2" ng-if="$ctrl.tab === 2">tab 2</div>'
  });

function TestComponent($scope, $log, $document){
  this.tab = 1;
  
  this.switchTab = function(){
     this.tab = this.tab === 1 ? 2 : 1;
  }
  
  $scope.$watch('$ctrl.tab', function(tab){
      $log.info('Looking for new active tab:', tab);
      var selector = '.tab' + tab;
      $log.info('with selector:', selector);
      var tabNode = $document[0].querySelectorAll(selector);
      $log.info('matches:', tabNode.length, 'expected: 1');
  });
  
}

＆＃13;

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">

  <title>The HTML5 Herald</title>
  <meta name="description" content="The HTML5 Herald">
  <meta name="author" content="SitePoint">

  <link rel="stylesheet" href="css/styles.css?v=1.0">

  <!--[if lt IE 9]>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
  <![endif]-->
</head>

<body ng-app="app">
  <test></test>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
</body>
</html>

＆＃13;

您可以看到结果为matches:0 expected: 1。我想在DOM更新后立即进行回调。我不想使用$ timeout和其他不可预测的方法。

更改后应用Angular

0 个答案: