Errore: [ngModel: nonassign] L'espressione non è assegnabile

Question

Tentativo di visualizzare un valore di colonna da una grigliacollection in base a un altro valore nella stessa riga. L'utente può selezionare/modificare i valori in una modale che contiene una griglia con valori. Quando la modale si chiude, i valori vengono restituiti. In quel momento mi piacerebbe impostare un valore per 'anche noto come':

html:

Also known as: <input type="text" `ng-model="displayValue(displayNameData[0].show,displayNameData[0].value)">` 

ho creato una funzione scopo di selezionare il valore solo quando il valore 'show' è vero:

$scope.displayValue = function (show, val) { 
    if (show) { 
     return val; 
    } 
    else { 
     return ''; 
    } 
} 

Tuttavia quando chiudo il modale ottengo un errore:

Error: [ngModel:nonassign] Expression 'displayValue(displayNameData[0].show,displayNameData[0].value)' is non-assignable. 

riferimento plnkr: http://plnkr.co/edit/UoQHYwAxwdvX0qx7JFVW?p=preview

Answer 1

Come accennato HackedByChinese, non è possibile associare ng-modello per una funzione, in modo da provare in questo modo:

<input type="text" ng-if="displayNameData[0].show" 
        ng-model="displayNameData[0].value"> 

Oppure, se volete questo controllo per essere visibile è possibile creare direttiva, aggiungere la funzione di $parsers che imposterà valore vuoto secondo show:

angular.module('yourModule').directive('bindIf', function() { 
     return { 
      restrict: 'A', 
      require: 'ngModel', 

      link: function(scope, element, attrs, ngModel) { 
       function parser(value) { 
        var show = scope.$eval(attrs.bindIf); 
        return show ? value: ''; 
       } 

       ngModel.$parsers.push(parser); 
      } 
     }; 
    }); 

HTML:

<input type="text" bind-if="displayNameData[0].show" 
        ng-model="displayNameData[0].value"> 

Answer 2

Utilizzare il valore ng invece di ng-model ha funzionato per me.

Answer 3

You can bind ng-model to function

Binding to a getter/setter
Sometimes it's helpful to bind ngModel to a getter/setter function. A getter/setter is a function that returns a representation of the model when called with zero arguments, and sets the internal state of a model when called with an argument. It's sometimes useful to use this for models that have an internal representation that's different from what the model exposes to the view.

index.html

<div ng-controller="ExampleController"> 
    <form name="userForm"> 
    <label>Name: 
     <input type="text" name="userName" 
      ng-model="user.name" 
      ng-model-options="{ getterSetter: true }" /> 
    </label> 
    </form> 
    <pre>user.name = <span ng-bind="user.name()"></span></pre> 
</div> 

app.js

angular.module('getterSetterExample', []) 
.controller('ExampleController', ['$scope', function($scope) { 
    var _name = 'Brian'; 
    $scope.user = { 
    name: function(newName) { 
    // Note that newName can be undefined for two reasons: 
    // 1. Because it is called as a getter and thus called with no arguments 
    // 2. Because the property should actually be set to undefined. This happens e.g. if the 
    // input is invalid 
    return arguments.length ? (_name = newName) : _name; 
    } 
    }; 
}]);