0
私は機能に取り組もうとしている小さなコードで角度をつけて作業しています： - 1.ユーザーの選択に応じて、はいまたはいいえをクリックすることができます（ラジオボタン） 2. [はい]をクリックすると、入力データ用の空のテキストフィールドが表示されます。 3.必要に応じて、追加のテキストフィールドを追加または削除するボタンがあります。私のラジオボタンがangularJSで正しく動作しません
私は、毎回「はい」と「いいえ」の間で切り替えようとすると、発生してはならないより多くのテキストフィールドが作成され、追加ボタンをクリックする必要があるという問題に直面しています。 ng-repeat機能を無効にすると、yesとnoのラジオボタンの切り替え時に追加のテキストフィールドが表示されなくなりますが、フィールドを追加または削除するボタンはどちらも機能しません。私は間違いを犯しているところでは無知です。
私のindex.htmlファイル
var app = angular.module("myWorld", []);
app.controller('msCtrl', myWorldMain);
function myWorldMain() {
$scope.worldClicked = function() { \t \t \t
if(angular.isUndefined($scope.peopleList)){
$scope.peopleList = [];
}
$scope.addPeopleRow();
}
$scope.addPeopleRow = function(){
\t \t \t // maximum is 20(0-19)
\t \t \t if (0 <= $scope.peopleList.length && $scope.peopleList.length < 20) {
\t \t \t \t $scope.peopleList.push({"checkBox":false,"customerid":"","organizationname":""});
\t \t \t \t
// \t \t \t \t \t
\t \t \t } else {
\t \t \t \t var msg = {error: $window.getCurrentContext().translateItemInstant("MyVar")};
\t \t \t \t alert(msg.error);
\t \t \t }
}
$scope.removePeopleRow = function(){
\t \t \t var len=$scope.peopleList.length;
\t \t \t var selectedRecords=[];
\t \t \t for(var i=0; i<len; i++){
\t \t \t \t if($scope.peopleList[i].checkBox){
\t \t \t \t \t selectedRecords.push($scope.peopleList[i]);
\t \t \t \t }
\t \t \t }
\t \t \t if(selectedRecords.length > 0){
\t \t \t \t for(j=$scope.peopleList.length-1; j>=0; j--){
\t \t \t \t \t if($scope.peopleList[j].checkBox){
\t \t \t \t \t \t $scope.peopleList.splice(j,1);
\t \t \t \t \t }
\t \t \t \t } \t \t \t \t
\t \t \t } else {
\t \t \t \t var msg = {error: $window.getCurrentContext().translateItemInstant($translate,"MyMesg)};
\t \t \t \t alert(msg.error);
\t \t \t \t return;
\t \t \t }
\t \t }
}
}<!DOCTYPE html>
<html data-ng-app="myWorld">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
</head>
<body ng-controller="msCtrl as moctrl">
<div>
<fieldset>
<span>
<input type="radio" data-ng-model="msCtrl.radio" title="My World" value="Y" data-ng-click="worldClicked()" id="myWorldradioYes"><label for="myWorldradioYes"> Yes</label>
<input type="radio" data-ng-model="msCtrl.radio" value="N" id="myWorldradioNo"><label for="myWorldradioYes">No</label>
</span>
</fieldset>
<br />
<div data-ng-if="myWorld.radio == 'Y'">
<table >
<thead>
<tr>
<th id="CheckBox" width="5%"></th>
<th id="custNumber" width="35%" translate="CustId"></th>
<th id="custLocation" width="60%" translate="Name_of_Organization"></th>
</tr>
</thead>
<tr data-ng-repeat="x in myWorldList">
<td align="left"><input type="checkbox" data-ng-model="x.checkBox" name="x.checkBox" value="x.checkBox"></td>
<td align="left"><label for="xcustid"/><input id="xcustid" type="text" name="x.custid" value="x.cusid" data-ng-model="x.cusid" maxlength="8" ng-class="x.custid.length>0 ? 'input-control focusedBlue':'input-control focusedRed'" required></td>
<td align="left"><label for="xorganizationname"/><input id="xorganizationname" name="x.organizationname" value="x.organizationname" type="text" size="50" data-ng-model="x.organizationname" maxlength="50" ng-class="x.organizationname.length>0 ? 'input-control focusedBlue':'input-control focusedRed'" required></td>
</tr>
<br/>
</table>
<div align="left" style="padding-left:25px">
\t
<button type="button" value="button" class="btn btn-success btn-s" href="JavaScript:void(0)" data-ng-click="addPeopleRow()">
<svg class="icon icon-circle-with-plus"><title>New party</title><use xlink:href="#icon-circle-with-plus"></use></svg>
<strong translate="New_Party"></strong> \t \t \t \t \t
</button>
<button type="button" value="button" class="btn btn-danger btn-s" href="JavaScript:void(0)" data-ng-click="removePeoplepRow()">
<svg class="icon icon-bin"><title>Remove party</title><use xlink:href="#icon-bin"></use></svg>
<strong translate="Remove_Party"></strong> \t \t \t \t \t
</button>
<br /> <br />
</div>
</div>
</div>
</body>
</html>
（）'、私はコードでそれを見ることができないのですか？ – sTx
コードを編集したことを確認してください。ありがとう。 –