angular.js – Modifica un valor del model por parámetro en una function

Tengo la siguiente vista:

<input ng-model="something" /> <button ng-click="modify(something)">Modify</button> 

Y este método del controller:

 $scope.modify = function (value) { value = value + " and this text"; }; 

Sin embargo, el método de modify no hace nada.

Lo que quiero hacer es crear una function que pueda modificar un object del model por parámetro. Quiero decir, una function x que recibe un object por parámetro, y dentro de esa function, este object (del model) puede ser modificado.

¿Cómo puedo conseguir esto?

Vea este violín para reference.

Es tarde, así que podría estar perdiendo lo obvio, sin embargo …

Como está pasando una cadena, se pasa por valor en lugar de reference. Así que cambié tu ng-click para referirme al object en el scope, en lugar del valor en sí mismo.

La function modificar se refiere al scope en lugar de la variable en sí misma.

Ver

 <div ng-app> <div ng-controller="SomeCtrl"> <input ng-model="something" /> <button ng-click="modify('something')">Modify</button> </div> </div> 

Controlador

 function SomeCtrl($scope) { $scope.something = "test"; $scope.modify = function (value) { $scope[value] = $scope[value] + " and this text"; }; } 

Mi sugerencia sería pasar el nombre de la variable a la function y modificarla como un par de key / valor del scope:

 <button ng-click="modify('something')">Modify</button> 

y

 $scope.modify = function(value){ $scope[value] = $scope[value] + " and this text"; }; 

El problema es que Javascript pasa variables simples (cadenas, numbers booleans, etc.) por valor, mientras que los objects y matrices se pasan por reference. Una alternativa sería que su model sea un object con un text key modificado por su function:

 <button ng-click="modify(something)">Modify</button> 

y

 $scope.something = {text: "something"}; $scope.modify = function(value){ value.text = value.text + " and this text"; }; 

Aquí está el violín

Y uno para el segundo enfoque

Maneje las variables internamente en su lugar.

Simplemente elimine la variable de su llamada de function:

 <input ng-model="something" /> <button ng-click="modify()">Modify</button> 

y luego en su controller, consulte something como una variable $scope :

 $scope.modify = function () { $scope.something = $scope.something + " and this text"; }; 

Esto puede ayudar. Aquí puede modificar un valor del model por parámetro en una function.

 var app = angular.module('angularjs-starter', []); app.controller('addRemoveVehicleCntrlr', function($scope) { $scope.vehicles = [{ id: 'vehicle1' }]; var allVins = []; $scope.addNewVehicle = function() { var newItemNo = $scope.vehicles.length + 1; $scope.vehicles.push({ 'id': 'vehicle' + newItemNo }); // console.log($scope.vehicles); }; $scope.getdetail = function(name, index, value) { console.log(name + index); allVins.splice(index, 1, { "vin": name, "trim": value }); console.log(allVins); $scope.myval = "dd"; } $scope.changeDetails = function(index, value) { // allVins.splice(index, 1, {"trim":value}); allVins[index].trim = value console.log(allVins); } $scope.removeVehicle = function(index) { $scope.vehicles.splice(index, 1); allVins.splice(index, 1); console.log(allVins) }; }); 
 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.js"></script> <div ng-app="angularjs-starter" ng-controller="addRemoveVehicleCntrlr"> <div style="background:#cecece; padding:10px;"> <div style="background:#EBEBEB; padding:10px; margin-bottom:3px" data-ng-repeat="vehicle in vehicles"> <input type="text" ng-model="vehicle.name" name="" placeholder="Enter mobile number"> <input type="button" value="Review" ng-click="getdetail(vehicle.name, $index, vehicle.value)" /> <div id="myVal">{{myval}}</div> <a class="remove" ng-show="vehicles.length > 1" ng-click="removeVehicle($index)">Remove vehicle</a> </div> </div> <button class="addfields" ng-click="addNewVehicle()">Add Vehicle</button> </div>