2017-01-11 8 views
0

私は角度のあるアプリケーションに取り組んでおり、ページロード時にテキストフィールドに焦点を合わせたいシナリオがあります。私はHTML5オートフォーカスを試みましたが、同じものに対してブラウザの互換性の問題があるため、代替ソリューションを見つける必要があります。関数呼び出しのng-initとonloadの違い[Angular JS]

ページロード時に私が望む入力フィールドに焦点を合わせる関数を呼び出す予定です。私は機能をロードするために角度NG-initでのonloadを、次のような機能を持っています。

私は角の文脈でどのような方法をとるべきか分かりませんが、その違いは少し分かりません。

のonload

<body onload="focusOnInput()"> 
     <form name="resetPasswordForm"> 
      <input name="NewPassword" type="password"/> 
     </form> 
    </body> 
    <script> 
     function focusOnInput() { 
      document.forms["resetPasswordForm"]["NewPassword"].focus(); 
     } 
    </script> 

角度NG-のinit

<body in-init="focusOnInput()"> 
     <form name="resetPasswordForm"> 
      <input name="NewPassword" type="password"/> 
     </form> 
     <script> 
      function focusOnInput() { 
      document.forms["resetPasswordForm"]["NewPassword"].focus(); 
      } 
     </script> 
    </body> 
+3

[角度のonLoadとng-initの違い]の可能な複製(http://stackoverflow.com/questions/18441775/difference-between-onload-and-ng-init-in-angular) – Sajeetharan

+0

ページのライフサイクルにおけるinitとloadの違いは?それは答えです –

答えて

0

のonloadは、あなたの角度のコンテキストではありません。 onload関数は、DOMのLOADイベントに対するコールバック関数です。

あなたのng-initは角の文脈です。角度ng-initを使用する必要があります。

あなたのコードに示されているようなng-init関数はそのまま動作しません。 ng-intで定義された関数は、角度的なコンテキスト内になければなりません。あなたのfocusOnInput()は角度のコンテキストにありません。それはJavaScriptのコンテキストです。

あなたはNG-INITを使用したい場合は、お使いのコントローラに$ウィンドウを注入してから$スコープにfocusOnInputを割り当てる使用し、NG-INITでこの

よう

何かを、そのメソッドを使用する必要があります

angular.module().controller('TestController',['$scope','$window',function($scope,$window){ 

...... 

$scope.myNewFunction = $window.focusOnInput; 

...... 



}]) 

あなたのng-initでこのmyNewFunctionを使用してください。

関連する問題