phonegap / ionic - $ scope里面的click函数没有更新

时间:2014-06-04 01:16:23

标签: angularjs cordova ionic-framework

我有一个简单的设置,我想点击一个按钮并从输入控件获取数据。问题是click函数内部的$ scope变量保持与首次运行代码时相同的值。当我在网上创建一个小提琴时,一切都按照计划完成。

HTML

<div ng-app>
    <div ng-controller="TodoCtrl">
        <input type="text" ng-model="authenticationCode">
        <br>
        <button class="button" ng-click="authenticate()">Authenticate</button>
        <br>
        <span>Auth info: {{authinfo}}</span>
        <br>
        <span>authenticationCode - {{authenticationCode}}</span>
    </div>
</div>

的JavaScript

function TodoCtrl($scope) {
    $scope.authenticationCode = 'TESTER';
$scope.authenticate = function(){
        var t = $scope.authenticationCode;
    $scope.authinfo = t;
    };
}

Fiddle of the code working in web

当我在PhoneGap中运行时

  • 屏幕加载&#39; TESTER&#39;在输入框中
  • 屏幕加载&#39; TESTER&#39;作为&#34; authenticationCode - &#34;
  • 的值
  • 更改&#39; TESTER&#39;在输入到&#39;已更改&#39;更新&#34; authenticationCode - &#34;改变&#39;
  • 点击&#39;验证&#39;把价值放在'TESTER&#39; as&#34; Auth info:&#34;

我不知道为什么$ scope.authenticationCode没有在authenticate函数中更新它的值。我也不确定为什么它在网络上有效,而我在PhoneGap中遇到Ionic问题。

1 个答案:

答案 0 :(得分:2)

由于TodoCtrl中正在使用原语,因此可能会出现此问题,请尝试此操作 -

HTML

<div ng-controller="TodoCtrl">
    <label class="item item-input">
        <input type="text" ng-model="input.authenticationCode">
    </label>
    <br>
    <button class="button" ng-click="authenticate()">Authenticate</button>
    <br><br>
    <span>Auth info: {{input.authInfo}}</span>
    <br>
    <span>authenticationCode - {{input.authenticationCode}}</span>
</div>

的JavaScript

.controller('TodoCtrl', ['$scope', function($scope) {
    $scope.input = {
        authenticationCode: 'TESTER',
        authInfo: ''
    };

    $scope.authenticate = function() {
        $scope.input.authInfo = $scope.input.authenticationCode;
        console.log('authInfo: ' + $scope.input.authInfo);
    };
}]);

Here is a CodePen of the above