オンクリックイベントでワンクリックで他のフィールドを編集できないのですか？

Question

<!--Below is the html code--> 

<div ng-init="InitializeFields()"> 
    <input type="text" on-click="makeOtherReadOnly('1')" 
    readonly="show_or_not_first"/> 
    <input type="text" on-click="makeOtherReadOnly('2')" readonly="show_or_not_second"/> 
</div> 

//今のjavascript

$scope.makeOtherReadOnly=function(number){ 
    if(number==='1'){ 
    show_or_not_second=true; 
show_or_not_first=false; 
    show_or_not_second=true; 
}else if(number==='2'){ 
show_or_not_first=true; 
    show_or_not_second=false; 
} 
}; 

    $scope.Initializer=function(){ 
    show_or_not_first=false; 
    show_or_not_second=false; 
    } 

    $scope.Initializer(); 

の内側に私が直面しています問題は、私は、入力フィールドをクリックするとpafeがロードされると、我々はどちらかのフィールドをクリックした後、それが読み取り専用に、他のフィールドを有効にしてくださいですしかし、それは2つのクリックが必要です...

すべての援助がいただきありがとうございます。

Answer 1

クリックをオンにしてngをクリックしてみてください。

Answer 2

あなたはあなたのコードイオンいくつか修正する必要があります。上のクリック、あなたの関数は、HTMLから呼び出すことができるので、ng-clickに

1. 変更を。
2. ng-readonlyに変更readonly、あなたはng-initで$scopeプロパティ
3. を利用することができますので、私はあなたがデフォルト値を初期化するためにInitializer()メソッドを呼び出す必要がありますね。

さらに2入力ボックスreadonlyを作成するには、これを1つのフラグでチェックします。文字列の比較はしません。

簡単なデモ：

angular.module('myApp', []).controller('myCtrl', function($scope) { 
 

 
    $scope.makeOtherReadOnly = function(boolValue) { 
 
    console.log(boolValue); 
 
    $scope.data.first = boolValue; 
 
    }; 
 

 
    $scope.Initializer = function() { 
 
    $scope.data = { 
 
     first: false 
 
    } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <div ng-init="Initializer()"> 
 

 
    First: <input type="text" ng-click="makeOtherReadOnly(false)" 
 
    ng-readonly="data.first" /> 
 

 
    Second: <input type="text" ng-click="makeOtherReadOnly(true)" 
 
    ng-readonly="!data.first" /> 
 
    </div> 
 
</div>