ionic 完美的融合下一代移動框架,ionic 基於Angular語法,支持 Angularjs 的特性。但是我在開發的時候,遇到了坑。因為之后用的就是angularjs,so 理所當然的以為代碼應該時這樣的寫:
<div class="item item-input"> <span>手 機 號:</span> <input type="text" ng-model="phone"> </div> <div class="item item-input"> <span>驗 證 碼:</span> <input type="text" ng-model="code"> <button class="button button-calm" ng-click="ionGetCode()">獲取驗證碼</button> </div> <div class="item item-input codeSuccess" > <span>新 密 碼:</span> <input type="text" ng-model="newPwd"> </div> <div class="item item-input codeSuccess" > <span>確認密碼:</span> <input type="text" ng-model="confirm"> </div>
在頁面:
{{phone}} //就可以直接獲取你輸入的值
但是在js中:
console.log("userName:"+$scope.userName);
console.log("$scope.phone:"+$scope.phone); //無法獲取輸入的值
之后查了官網文檔,也查了很多資料,才知道這樣寫也不行的,詳細解釋可以去官網:http://ionicframework.com/docs/
<div class="item item-input"> <span>手 機 號:</span> <input type="text" ng-model="$parent.phone"> </div> <div class="item item-input"> <span>驗 證 碼:</span> <input type="text" ng-model="$parent.code"> <button class="button button-calm" ng-click="ionGetCode()">獲取驗證碼</button> </div> <div class="item item-input codeSuccess" > <span>新 密 碼:</span> <input type="text" ng-model="$parent.newPwd"> </div> <div class="item item-input codeSuccess" > <span>確認密碼:</span> <input type="text" ng-model="$parent.confirm"> </div>