Error using ng-model on a button element

Question

Error using ng-model on a button element

Navigation

#1 by (1 votes)

1

I am trying to place the value in the table in the insert tasks in ng-model , but I get the following error:

Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 2 of the expression [{{tarea.fila}}] starting at [{tarea.fila}}]

The values I keep are the following:

objetoTarea = [{
  fila: 1,
  texto: "Examen de calculo",
  fecha: "12-05-2016"
}];

calendarioestu.html

<ul class="list">

        <li class="item item-divider">
            Tareas
        </li>

        <li class="item item-button-right" ng-repeat="tarea in nueva.tareasEstu">
            <h3 class="title">{{tarea.texto}}</h3>
            <button class="button button-clear button-balanced" ng-model="{{tarea.fila}}" ng-click="eliminarTareas()">
                <i class="icon ion-ios-close-empty"></i>
            </button>
        </li>

    </ul>

The text shows it without any problem, but the ng-model that is there, I put it since not even the editor allows it to be put there and I do not know why.

calendarioestu.js

$scope.eliminarTareas = function() {

    var fila_Tarea;

    fila_Tarea = $scope.nueva.fila;
    console.log(fila_Tarea);
}

The previous code is for the purpose of obtaining this value in ng-model , but not being able to use it, I do not know how to do it then.

angularjs ionic

asked by Pedro Miguel Pimienta Morales 21.07.2016 в 00:25

source

1 answer

Find is not a function Disadvantage with conditional nests in Bat

score 1 · Accepted Answer

As you can see in the documentation from AngularJs, the use of the ng-model directive is restricted to the elements of type input , textarea and select .

In addition, this directive establishes a text value by referring to the property of the scope to which you want to link and not an expression.

I do not know exactly what you want to do, but if you want to delete a task identified by the property fila it would be enough to pass it as a parameter to the 'deleteTareas' method

Your view would look like this:

<ul class="list">

    <li class="item item-divider">
        Tareas
    </li>

    <li class="item item-button-right" ng-repeat="tarea in nueva.tareasEstu">
        <h3 class="title">{{tarea.texto}}</h3>
        <button class="button button-clear button-balanced" ng-click="eliminarTareas(tarea.fila)">
            <i class="icon ion-ios-close-empty"></i>
        </button>
    </li´
</ul>

And this would be the method receiving as parameter the row to be deleted

$scope.eliminarTareas = function(fila_tarea) {

    console.log(fila_Tarea);
}