コントローラの初期化中にフォームオブジェクトが使用できないのはなぜですか？

Question

は、私がかつてそのform not exist少なくともプリントを観察し、次のHTML

<div ng-app="myApp" ng-controller="myController"> 
    <form name="myForm"></form> 
</div> 

とコントローラファイル

(function() { 
    'use strict'; 

    angular 
     .module('myApp') 
     .controller('myController', myController); 

    myController.$inject = ['$scope', '$interval']; 

    function myController($scope, $interval) { 
     var myFormDetector = $interval(function() { 
      if ($scope.myForm) { 
       console.log('form exist'); 
       $interval.cancel(myFormDetector); 
      } else { 
       console.log('form not exist'); 
      } 

     }, 200) 
    } 
})(); 

を考えてみましょうか？

私は、レンダリングの順序がintializedされた時間controllerによってそう

compile 
controller 
link 

、compile HTMLをレンダリングし、$scopeを注入すべきであると考え、これは非常に好奇心が強いのですか？

何か間違っていますか？

Answer 1

親要素のコントローラが作成され、子要素の前にリンクされます。

<div ng-app='myApp' ng-controller='myController'> 
    <form name='myForm' ng-init='myController.onInit()'> 
    </form> 
</div> 

function MyController($scope) { 
    this.$scope = $scope 
} 

MyController.prototype.onInit = function onInit() { 
    this.$scope.myForm.... 
} 

これはしかし非常に持続可能ではない、そしてそれは悪い習慣に考えられています：あなたは子フォームについて知るために、親要素が必要な場合は、おそらくこのような何かをしたいですこのようにngControllerを使用してください。このパターンは、角度がそれのためにコンポーネントのバインディング（角1.5+）

<div ng-app='myApp'> 
    <x-parent-component> 
    <form name='ngForm'> 
    </form> 
    </x-parent-component> 
</div> 

angular.module('myApp', []) 
    .component('xParentComponent', { 
    controller: XParentComponentCtrl, 
    transclude: true, 
    template: '<div ng-transclude></ng-transclude>' 
    }) 

function XParentComponentCtrl($scope) { 
    this.$scope = $scope 
} 
XParentComponentCtrl.prototype.$postLink = function $postLink() { 
    this.$scope.myForm... 
} 

を持っているという事実に、しかしとても一般的な一般的であるあなたは、このかかわらずをやりたいか？ 親のの要素がの子の子であるのような要素の場合は、結合が高いことを示していると考えられます。あなたは、おそらく通信を別の方法で行うことを検討すべきです。 子供コンポーネントは、変更について約親コンポーネントに伝えます。