Angolare: premere l’elemento di lista non si aggiorna la vista

Quando premo un elemento di un array, la vista non aggiornare l’elenco.

tabella:

<tbody id="productRows">
    <tr data-ng-repeat="product in products | filter: search">
        <td>{{ product.Code}}</td>
        <td colspan="8">{{ product.Name}}</td>
    </tr>
</tbody>

forma:

<form data-ng-submit="submitProduct()">
    Code:
    <br />
    <input type="text" required data-ng-model="product.Code"/>
    <br />
    <br />
    Naam:
    <br />
    <input type="text" required data-ng-model="product.Name"/>
    <br />
    <input type="submit" value="Opslaan" />
</form>

submitProduct nel controller:

$scope.submitProduct = function () {
    console.log('before: ' + $scope.products.length);

    $scope.products.push({Code: $scope.product.Code, Name: $scope.product.Name});
    console.log('after:' + $scope.products.length);
    console.log($scope.products);

    $scope.showOverlay = false;
};

Come si può vedere, io registro il totale di elementi nella matrice e si comporta come mi sarei aspettato. L’unica cosa che non fa quello che mi aspetto è il contenuto del mio tavolo, che non mostra il nuovo valore.

Cosa devo fare, in modo che la nuova riga viene visualizzato nella tabella?

  • Sembra che dovrebbe funzionare. Aggiungi un jsfiddle o plnkr per favore.
  • Questo plnkr con il tuo codice funziona bene? Stai definendo $scope.i prodotti in maniera corretta?
  • Cos’è il codice di chiamata submitProduct()? Se questo codice è in esecuzione “al di fuori” Angolare, avrai bisogno di chiamare $scope.$apply() alla fine del submitProduct() metodo a causa Angolare per eseguire un digest del ciclo, che causa la visualizzazione di aggiornamento.
InformationsquelleAutor Martijn | 2013-05-16



2 Replies
  1. 5

    Non riesco a vedere il resto del codice, ma assicurarsi che $scope.products è definito nel controllore.

    Vedere questo esempio.

    L’unica aggiunta che ho fatto per il codice che ti è stato fornito:

    $scope.products = [];

    Se questo non aiuta, quindi si prega di fornire ulteriori informazioni.

    • La tua soluzione ha funzionato per me. Ho avuto lo stesso problema, dove gli elementi in cui non essere spinto mio $scope.le liste.push({});. Ho dichiarato $scope.elenca = []; sulla parte superiore e ha funzionato come un fascino. Grazie.
  2. 5

    Grazie per la risposta e i commenti. Il problema era in un altro luogo. Nel mio routeProvider avevo dichiarato un controller. Ho anche avuto un ng-controller direttiva nel mio div. Quindi il mio controller viene eseguito due volte. Quando ho rimosso il ng-controller direttiva, tutto funziona come dovrebbe 🙂

    • Grazie! , ha anche risolto il mio problema, ho dichiarato un controller in routeProvider mentre il mio corpo aveva già un ng-controller di attributo. Come hai fatto a sapere che era il problema ?
    • Beh, guardo il mio codice dall’inizio fino alla fine. Così ho iniziato con ap..modulo, app.percorsi, tutta la strada per il mio punto di vista. E quando guardo il mio punto di vista ho notato che avevo dichiarato lo stesso controller due volte: nel mio percorso e il mio punto di vista.
    • Grazie! Questo spettacolo il mio problema, troppo! 🙂 Io non l’utente routeProvider, ma io uso lo stesso controller div diversi nella stessa pagina. E ogni volta che schiaccio qualcosa a matrice, il controller di ricarica, quindi non ho potuto inserire qualcosa. Grazie mille!

Lascia un commento