如何使用ng-init（）在頁面加載時執行函數而不受其他元素的影響？

Question

我已經遠離編碼大約4年了，現在我正在重新學習PHP 7和AngularJs的編程。 我構建了一個簡單的CRUD應用程序來研究一些概念，我有一個簡單的表，顯示我的數據庫中的記錄，到目前為止我已經設法對表進行排序，它工作正常。 問題是，我通過使用ng-init調用函數來填充表，它加載函數就好了，但問題是，當我在表上方的TextBox上鍵入以插入新的Record時，它會不斷整理表下面。 我已經谷歌了但是找不到我的問題的答案。 希望可以有人幫幫我。

   <body >
<div class="container">
    <div class="row text-center">
        <h1>BANCO PHP - CADASTRO DE CLIENTES</h1>
        <hr>

    </div>
    <div ng-app="myApp" ng-controller="cntrl" ng-init="showclientes()"> 
    <div class="row container">

        <div class="col-md-8">
            <form class="form-inline">
            <div class="form-group">
            <label for="id">Id</label>
            <input type="text" class="form-control" placeholder="Id" id="id" ng-model="id" disabled>
            </div>
            <div class="form-group">
            <label for="nome">Nome</label>
            <input type="text"  class="form-control" placeholder="Nome" id="nome" ng-model="nome">
            </div>
            <div class="form-group">
            <label for="saldo">Saldo</label>
            <input type="text" class="form-control" placeholder="Saldo" id="saldo" ng-model="saldo">
            </div>

            <input type="submit"  class="btn btn-default" value="{{nomebotao}}" ng-click="insertdata()">

            </form>
            </div>
            <div class="col-md-4"><label class="bg-success">{{msg}}</label>
        </div>
            </div> <!-- div row form -->


        <div class="row container">
            <hr>
            <h3>RESULTADOS</h3>
            <hr>
        </div>
        <div class="row col-md-6">
        <table class="table">
        <thead>
            <tr>

            <th><a href="#" ng-click="tipoOrdem = 'id*1'">Id<span ng-show="tipoOrdem == 'id'; ordemReversa = !ordemReversa" class="fa fa-caret-down"></span>
            </a></th>


            <th><a href="#" ng-click="tipoOrdem = 'nome'">Nome<span ng-show="tipoOrdem == 'nome'; ordemReversa = !ordemReversa" class="fa fa-caret-down"></span>
            </a></th>


            <th><a href="#" ng-click="tipoOrdem = 'saldo'">Saldo<span ng-show="tipoOrdem == 'saldo'; ordemReversa = !ordemReversa" class="fa fa-caret-down"></span>
            </a></th>

            </tr>
        </thead>
        <tbody>
        <tr ng-repeat="cliente in data | orderBy:tipoOrdem:ordemReversa">

            <td>{{cliente.id}}</td>
            <td>{{cliente.nome}}</td>
            <td>{{cliente.saldo}}</td>
            <td><button ng-click="deletecliente(cliente.id)" class="btn btn-danger fa fa-trash-o fa-lg"></button>
            <td><button ng-click="updatecliente(cliente.id, cliente.nome, cliente.saldo)" class="btn btn-primary fa fa-edit fa-lg"></button>

        </tr>
        </tbody>
        </table>
        </div> <!-- div row table --> 


    </div> <!-- div controler -->

</div> <!-- div main container -->


<!--  javascript funcoes -->

<script>
var app=angular.module('myApp', []);
app.controller('cntrl', function($scope, $http){

    $scope.tipoOrdem = 'id*1';
    $scope.ordemReversa = false;
    $scope.nomebotao="Salvar";



    $scope.insertdata=function(){

        $http.post("insert.php", {'id':$scope.id, 'nome':$scope.nome, 'saldo':$scope.saldo, 'botao':$scope.nomebotao})
        .success(function(){

            $scope.msg= "Data Saved";
            $scope.showclientes();
        });
    }

    $scope.showclientes=function(){
        $http.get("select.php")
        .success(function(data){

            $scope.data=data

        });

    }


    $scope.deletecliente=function(id){
        $http.post("delete.php", {'id':id})
        .success(function(){
            $scope.msg="Registro excluído.";
            $scope.showclientes();
        });
    }

    $scope.updatecliente=function(id,nome,saldo){

        $scope.id=id;
        $scope.nome=nome;
        $scope.saldo=saldo;
        $scope.nomebotao="Atualizar";

    }



});

</script>

</body>

Answer 1

我只能用這個發現的問題sort這是把自己在無限循環導致鏈接$ rootScope：infdig ..更新他們像這樣..

<th><a href="#" ng-click="tipoOrdem = 'id';ordemReversa = !ordemReversa">Id<span ng-show="tipoOrdem == 'id' && ordemReversa" class="fa fa-caret-down"></span>
</a></th>


<th><a href="#" ng-click="tipoOrdem = 'nome';ordemReversa = !ordemReversa">Nome<span ng-show="tipoOrdem == 'nome' && ordemReversa" class="fa fa-caret-down"></span>

</a></th>


<th><a href="#" ng-click="tipoOrdem = 'saldo';ordemReversa = !ordemReversa">Saldo<span ng-show="tipoOrdem == 'nome' && ordemReversa" class="fa fa-caret-down"></span>
</a></th>

如何使用ng-init（）在頁面加載時執行函數而不受其他元素的影響？

問題描述

1 個解決方案

解決方案1
0 2016-12-01 22:26:33

如何使用ng-init（）在頁面加載時執行函數而不受其他元素的影響？

問題描述

1 個解決方案

解決方案1 0 2016-12-01 22:26:33

解決方案1
0 2016-12-01 22:26:33