Question

使用角度代码添加行。输入框型号名称为＆＃34;代码＆＃34;。当单击此输入框时，模型打开，当任何行选择使用angularjs时，当我使用$ scope.code分配值时会出现问题，它将分配给所有输入框但是我想分配执行ng-click的值

<table class="table table-bordered table-hover table-condensed">
    <tr style="font-weight: bold">
        <td style="width:35%">Code</td>
    </tr>
    <tr ng-repeat="user in users">
        <td>
            <!-- editable username (text with validation) -->
            <span ng-show="editDel">
            @{{ user.name || 'empty' }}
            </span>
            @{{code}}
            <input type="text" name="" ng-model="code" ng-show="saveCancel" ng-click="getCode()">
        </td>

        <td style="white-space: nowrap">
            <!-- form -->
            <form ng-show="saveCancel" class="form-buttons form-inline">
            <button type="submit" class="btn btn-primary">
            save
            </button>
            <button type="button" ng-click="isCancel()" class="btn btn-default">
            cancel
            </button>
            </form>
            <div class="buttons" ng-show="editDel">
            <button class="btn btn-primary" ng-click="editUser($index)">edit</button>
            <button class="btn btn-danger" ng-click="removeUser($index)">del</button>
            </div>  
        </td>
    </tr>
</table>

$scope.users = []; 
$scope.saveCancel = false;
$scope.editDel = true;

$scope.saveUser = function(data, id) {
    //$scope.user not updated yet
    angular.extend(data, {id: id});
    return $http.post('/saveUser', data);
};

// remove user
$scope.removeUser = function(index) {
    $scope.users.splice(index, 1);
};

// add user add row
$scope.addUser = function() {
    $scope.inserted = {
      id: $scope.users.length+1,
      name: '',
      status: null,
      group: null 
    };
    // $scope.taxNamePopup();
    $scope.users.push($scope.inserted);
};

$scope.getCode = function(){
    // alert(input_id);
    this.code = 'nameValue';//**this assin value to selected box**
    // jQuery("#tax_modal").modal("hide");
    var request = $http({
        method: "get",
        url: base_url+"/load-tax",
        data: {
        },
    }).then(function successCallback(response) {
        jQuery("#tax_list").modal("show");
        $scope.tax_data1 = response;
    }, function errorCallback(response) {

    });
}

$scope.getSelected = function(id,code,desc,rate){
     alert(code);
     this.code = code;//**but i want to assign value to selected input box from here**
     jQuery("#tax_list").modal("hide");
}

$scope.safeApply(function() {
  $scope.editUser = function($id){
    this.saveCancel = true;
    this.editDel = false;
  }
});

$scope.isCancel = function(){
    this.saveCancel = false;
    this.editDel = true;
}

Answer 1

这是因为每ng-model code为input。

使用以下代码示例更改它

<input type="text" name="" ng-model="code_$index" ng-show="saveCancel" ng-click="getCode($index)">

现在，上面的代码将更改每个输入字段的ng-model唯一值，并根据索引检索getCode中的值。

Answer 2

每个ng-repeat项目的模型应该是不同的

EDIT从getCode（user.code）更改为getCode（user）

$scope.getCode = function(user){
      angular.forEach($scope.users, function (value, key) {
          if (value.id == user.id) {
                  $scope.users[key]=user;
          }
     });
}

如何使用param;）

Vue.component('component', {
  template: `<button><slot></slot></button>`,
  created: function() {
    // i would like to access the text in slot here
  }
});

使用Angular js

2 个答案:

EDIT从getCode（user.code）更改为getCode（user）