agregar - ng-bind-html angularjs
cambio de ng no funciona en una entrada de texto (6)
Cuando quiera editar algo en Angular, necesita insertar un ngModel en su html
prueba esto en tu muestra:
<input type="text" name="abc" class="color" ng-model="myStyle.color">
¡No necesitas ver el cambio en absoluto!
Soy nuevo en angular js. En mi código hay un selector de color inicializado desde un campo de texto. El usuario cambia el valor del color y quiero que ese color se refleje como fondo de un texto en un lapso. No está trabajando. ¿Lo que falta?
HTML:
<body ng-app="">
<input type="button" value="set color" ng-click="myStyle={color:''red''}">
<input type="button" value="clear" ng-click="myStyle={}">
<input type="text" name="abc" class="color" ng-change="myStyle={color:''green''}">
<br/>
<span ng-style="myStyle">Sample Text</span>
<pre>myStyle={{myStyle}}</pre>
</body>
Plunker - http://plnkr.co/edit/APrl9Y98Em0d6rxuzRDE?p=preview
Sin embargo, cuando lo cambio a ng-click
funciona.
Primero, estoy viendo tu código y no tienes ningún controlador. Así que te sugiero que uses un controlador. Creo que tienes que usar un controlador porque tu variable {{myStyle}}
no se compila porque las dos llaves son visibles y no deberían.
Segundo, tiene que usar ng-model para su entrada, esta directiva vinculará el valor de la entrada a su variable.
Tal vez puedas probar algo como esto:
Usando una directiva
directive(''watchChange'', function() {
return {
scope: {
onchange: ''&watchChange''
},
link: function(scope, element, attrs) {
element.on(''input'', function() {
scope.onchange();
});
}
};
});
También se puede vincular una función con el detector de eventos ng-change
, si necesitan ejecutar una lógica un poco más compleja.
<div ng-app="myApp" ng-controller="myCtrl">
<input type=''text'' ng-model=''name'' ng-change=''change()''>
<br/> <span>changed {{counter}} times </span>
</div>
...
var app = angular.module(''myApp'', []);
app.controller(''myCtrl'', function($scope) {
$scope.name = ''Australia'';
$scope.counter = 0;
$scope.change = function() {
$scope.counter++;
};
});
Tengo el mismo problema, mi modelo está vinculado desde otra forma, he agregado ng-change
y ng-model
y todavía no funciona:
<input type="hidden" id="pdf-url" class="form-control" ng-model="pdfUrl"/>
<ng-dropzone
dropzone="dropzone"
dropzone-config="dropzoneButtonCfg"
model="pdfUrl">
</ng-dropzone>
Una entrada #pdf-url
obtiene datos de Dropzone (enlace de dos maneras), sin embargo, ng-change
no funciona en este caso. $scope.$watch
es una solución para mí:
$scope.$watch(''pdfUrl'', function updatePdfUrl(newPdfUrl, oldPdfUrl) {
if (newPdfUrl !== oldPdfUrl) {
// It''s updated - Do something you want here.
}
});
Espero que esto ayude.
ng-change requiere ng-model,
<input type="text" name="abc" class="color" ng-model="someName" ng-change="myStyle={color:''green''}">