イオンフレームワークの "イオン含有量"から "ng-click"が機能しない

Question

私のionicベースのアプリケーションにng-model属性の入力ボックスがあります。 ion-contentタグ内のコード：

​​

そしてフッターバーで私はこれがあります。

<div class="bar bar-footer bar-balanced" style="background-color: #00368C !important; color: #fff;"> 
    <div class="title"> 
     <button ng-click="submit(myNumber)" class="button button-clear">Submit</button> 
    </div> 
</div> 

を警告結果は、未定義です。

注：buttonをion-contentの内部に配置すると、正常に動作します。 （つまり、jsコードは正常に動作することを意味します）

Answer 1

問題の原因は、親スコープからプロトタイプ的に継承されたion-content directive does create a child scopeです。したがってmyNumberを入力ng-modelに配置すると、ion-contentのスコープ内に追加されますが、それはコントローラmyNumberの数値スコープの変数とは異なります。

ng-modelを定義している間にdot ruleを実行する必要があるため、プロトタイプの継承ルールが従うようにします（参照型変数で機能します）。 コントローラ内に新しいオブジェクトを作成し、すべてのng-model変数を割り当てます。その後、

$scope.model = {}; 

、以下のようにmodel.myNumber

マークアップ

<ion-content class="padding"> 
    <input ng-model="model.myNumber" type="number" placeholder="Enter number"> 
</ion-content> 

<div class="bar bar-footer bar-balanced" style="background-color: #00368C !important; color: #fff;"> 
    <div class="title"> 
     <button ng-click="submit(model.myNumber)" class="button button-clear">Submit</button> 
    </div> 
</div> 

詳細説明できるようにそれを使用するビューでそれを使用しているときに$scope.model.myNumber &ようなビューで使用したいすべてのプロパティを置きます〜で見つけることができますthis answer

それを行うよりエレガントな方法は、controllerAsアプローチを使用しています。