drw85135 2016-11-17 14:56
浏览 65

Angular JS - ng-repeat错误

I do not speak English very well, so I apologize in advance for my misspellings

I am creating a user administration page on a site already developed with angular js but it is the first time that i'm using it and I can not figure out the error
When I click on the list on the index.html page to be sent back to the page amministrazione2.html where "should" start the script to get the data from the db and insert them in the table, but the video show

<tbody> <!-- ngRepeat: prezzo in prezzi --> <t/ body> 


instead of my data


this is the index.html, where there is a list on the left and evry item redirect to a .html page

<!DOCTYPE html>
<html ng-app="sin...">
  <head></head>
<body>
    <div class="left_col scroll-view">
            <div ng-include="'includes/header.html'"></div>
            </div>
    </div>
    <div ng-include="'includes/footer.html'"></div>
    </div>
    <script src="//code.angularjs.org/1.5.7/angular.js"></script>
    <script src="//code.angularjs.org/1.5.7/angular-route.js"></script>
    <script src="//code.angularjs.org/1.5.7/angular-cookies.js"></script>
    <script src="//code.angularjs.org/1.5.7/angular-messages.js"></script>

    <script src="js/app.js"></script>

    <script src="modules/amministrazione2/controllers.js"></script>

</body>
</html>

this is the header where there are the element on the left list

<div id="sidebar-menu" class="main_menu_side hidden-print main_menu">

   <div class="menu_section">
     <li>
       <a href="#/amministrazione2">
          <i class="fa fa-cog infospan"></i> Amministrazione2 <span class="fa fa-chevron-right"></span></a>
     </li>
   </div>
</div>

this is the file app.js where there are the declaretions of the angular module

'use strict';

// declare modules
angular.module('Ammi', []);
angular.module('Amministrazione', []);
angular.module('Authentication', []);
angular.module('Home', []);
angular.module('Fornitore', []);
angular.module('Cantiere', []);
angular.module('Prezziario', []);
angular.module('Calendar', []);
angular.module('Computo', []);
angular.module('Forniture', []);
angular.module('Listino', []);
angular.module('Sal', []);



angular.module('sin...', [
    'Amministrazione',
    'Ammi',
    'Authentication',
    'Home',
    'Fornitore',
    'Cantiere',
    'Prezziario',
    'Calendar',
    'Computo',
    'Forniture',
    'Listino',
    'Sal',
    'ngRoute',
    'ngCookies',
    'ngMessages',
    'smart-table'
])

.config(['$routeProvider', function ($routeProvider) {

    $routeProvider
        .when('/amministrazione2', {
            controller: 'AmmiController',
            templateUrl:  'modules/amministrazione2/views/amministrazione2.html',
            hideMenus: true
        })
        .when('/', {
            controller: 'HomeController',
            templateUrl: 'modules/home/views/home.html'
        })

        .otherwise({ redirectTo: '/login' });
}])

this is my php file for search the user information on db

<?php
    require_once '../includes/dbconnector.php';

    $sql = "SELECT a.id_utente, a.id_ruolo, a.nome, a.cognome, a.comune, a.indirizzo, a.cap, a.telefono1, a.telefono2, a.email, a.fax, a.note, a.user, a.password, a.calendario FROM `sal_t_utente` a ORDER BY a.id_utente";
    // use prepared statements, even if not strictly required is good practice
    $stmt = $conn->prepare( $sql );

    // execute the query
    $stmt->execute();

    // fetch the results into an array
    $result = $stmt->fetchAll( PDO::FETCH_ASSOC );

    $json = json_encode($result);

    return $json;
}
?>

this is the angular controller the i've create for insert and modify the data on the table

'use strict';

angular.module('Ammi').controller('AmmiController',
    ['$scope', '$rootScope', '$location','$http',
    function ($scope, $rootScope, $location, $http) {
        $scope.selectedPrezzo = '';

       $scope.getPrezzi = function()
       {
           $http.get('./api/amministrazione2/ricerca.php').
                success(function(data) {
                    $scope.prezzi = data;
                    $scope.prezziCollection= data;
                });
       };

       $scope.editPrezzo = function(prezzo)
       {
            $scope.selectedPrezzo = prezzo;
       };

       $scope.salvaPrezzo = function(prezzo)
       {
            $http.post('./api/amministrazione2/aggiorna.php', {
                'id_utente' : prezzo.id_utente, 
                'id_ruolo' : prezzo.id_ruolo,
                'nome' : prezzo.nome,
                'cognome' : prezzo.cognome,
                'comune' : prezzo.comune, 
                'indirizzo' : prezzo.indirizzo,
                'cap' : prezzo.cap,
                'telefono1' : prezzo.telefono1, 
                'telefono2' : prezzo.telefono2,
                'email' : prezzo.email,
                'fax' : prezzo.fax, 
                'note' : prezzo.note,
                'user' : prezzo.user,
                'password' : prezzo.password,
                'calendario' : prezzo.calendario
                }
                ).success(function (data, status, headers, config) {
                    $scope.resetPrezzo();
                });
       };
       $scope.resetPrezzo = function()
       {
            $scope.getPrezzi();
            $scope.selectedPrezzo = '';
       };

       $scope.go = function ( path ) {
          $location.path( path );
        };  

    }]);

this is the amministrazioni2.html that show the user information

    <div ng-controller="getPrezzi" >
  <table st-table="prezzi" st-safe-src="prezziCollection" class="bootstrap-table table table-hover table-striped table-bordered tableBlueTh">
    <thead>
                <th>Id Utente</th>
                <th>Id Ruolo</th>
                <th>Nome</th>
                <th>Cognome</th>
                <th >Comune</th>
                <th>Indirizzo</th>
                <th>Cap</th>
                <th >Telefono 1</th>
                <th>Telefono 2</th>
                <th >Email</th>
                <th>Fax</th>
                <th>Note</th>
                <th>User</th>
                <th>Password</th>
                <th>Calendario</th>
                <th></th>
    </thead>
    <tbody>
    <tr ng-repeat="prezzo in prezzi">
        <td>{{prezzo.id_utente}}</td>
        <td>{{prezzo.id_ruolo}}</td>
        <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.nome}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="textbox" class="form-control" ng-model="prezzo.nome" value="{{prezzo.nome}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.cognome}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="textbox" class="form-control" ng-model="prezzo.cognome" value="{{prezzo.cognome}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.comune}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="textbox" class="form-control" ng-model="prezzo.comune" value="{{prezzo.comune}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.indirizzo}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="textbox" class="form-control" ng-model="prezzo.indirizzo" value="{{prezzo.indirizzo}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.cap}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="textbox" class="form-control" ng-model="prezzo.cap" value="{{prezzo.cap}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.telefono1}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="tel" class="form-control" ng-model="prezzo.telefono1" value="{{prezzo.telefono1}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.telefono2}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="tel" class="form-control" ng-model="prezzo.telefono2" value="{{prezzo.telefono2}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.email}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="textbox" class="form-control" ng-model="prezzo.email" value="{{prezzo.email}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.fax}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="tel" class="form-control" ng-model="prezzo.fax" value="{{prezzo.fax}}"></div>
                    </td>
                    <td>
                        <div  ng-if="selectedPrezzo != prezzo">{{prezzo.note}}</div>
                        <div ng-if="selectedPrezzo == prezzo"><input type="textbox" class="form-control" ng-model="prezzo.note" value="{{prezzo.note}}"></div>
                    </td>
        <td>{{prezzo.user}}</td>
        <td>{{prezzo.password}}</td>
        <td>{{prezzo.calendario}}</td>
        <td>
            <div  ng-if="selectedPrezzo != prezzo">
                <button ng-click="editPrezzo(prezzo)" class="btn btn-primary">Modifica</button>
            </div>
            <div  ng-if="selectedPrezzo == prezzo">
                <button ng-click="salvaPrezzo(prezzo)" class="btn btn-primary">Salva</button>
                <button ng-click="resetPrezzo()" class="btn btn-danger">Annulla</button>
            </div>
        </td>
    </tr>

    </tbody>
    <tfoot>
            <tr>
                <td colspan="16" class="text-center">
                    <div st-pagination="" st-items-by-page="itemsByPage" st-displayed-pages="7"></div>
                </td>
            </tr>
        </tfoot>
   </table>
</div>

in the end this is what i see on the site

<div ng-view="" class="ng-scope">


<div ng-controller="getPrezzi" class="ng-scope">
    </div><table st-table="prezzi" st-safe-src="prezziCollection" class="bootstrap-table table table-hover table-striped table-bordered tableBlueTh ng-scope">
    <thead>
                <tr><th>Id Utente</th>
                <th>Id Ruolo</th>
                <th>Nome</th>
                <th>Cognome</th>
                <th>Comune</th>
                <th>Indirizzo</th>
                <th>Cap</th>
                <th>Telefono 1</th>
                <th>Telefono 2</th>
                <th>Email</th>
                <th>Fax</th>
                <th>Note</th>
                <th>User</th>
                <th>Password</th>
                <th>Calendario</th>
                <th></th>
    </tr></thead>
    <tbody>
    <!-- ngRepeat: prezzo in prezzi -->

    </tbody>
    <tfoot>
            <tr>
                <td colspan="16" class="text-center">
                    <div st-pagination="" st-items-by-page="itemsByPage" st-displayed-pages="7" class="ng-isolate-scope"><!-- ngIf: numPages && pages.length >= 2 --></div>
                </td>
            </tr>
        </tfoot>
</table>
</div>
  • 写回答

1条回答 默认 最新

  • douqiang3768 2016-11-17 15:19
    关注

    I add below a page functioning of the site to which I have referred for my page

    modificaprezzario.html

    <div ng-controller="getPrezzi" >
    
    
    <table st-table="prezzi" st-safe-src="prezziCollection" class="bootstrap-table table table-hover table-striped table-bordered tableBlueTh">
        <colgroup>
            <col width="20%">
            <col width="50%">
            <col width="5%">
            <col width="5%">
            <col width="5%">
            <col width="25%">
         </colgroup>
        <thead>
        <tr>
            <th colspan="6"><input st-search="" class="form-control" placeholder="Ricerca globale ..." type="text"/></th>
        </tr>
        <tr>
            <th colspan="6" style="padding-bottom: 2em;background:#FFF"></th>
        </tr>
        <tr>
            <th st-sort="tariffa" class="pointer" title=Tariffa">Tariffa</th>
            <th st-sort="descrizione" class="pointer" title=Descrizione">Descrizione</th>
            <th st-sort="descrizione" class="pointer">Unit&agrave; di misura</th>
            <th st-sort="prezzo" class="pointer">Prezzo Listino</th>
            <th st-sort="prezzo_azie" class="pointer">Prezzo Aziendale</th>
            <th></th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="prezzo in prezzi">
            <td>{{prezzo.tariffa}}</td>
            <td>{{prezzo.descrizione}}</td>
            <td>{{prezzo.unita_misura}}</td>
            <td>{{prezzo.prezzo}}</td>
            <td>
                <div  ng-if="selectedPrezzo != prezzo">{{prezzo.prezzo_azie}}</div>
                <div ng-if="selectedPrezzo == prezzo"><input type="number" class="form-control" ng-model="prezzo.prezzo_azie" value="{{prezzo.prezzo_azie}}"></div>
            </td>
            <td>
                <div  ng-if="selectedPrezzo != prezzo">
                    <button ng-click="editPrezzo(prezzo)" class="btn btn-primary">Modifica</button>
                </div>
                <div  ng-if="selectedPrezzo == prezzo">
                    <button ng-click="salvaPrezzo(prezzo)" class="btn btn-primary">Salva</button>
                    <button ng-click="resetPrezzo()" class="btn btn-danger">Annulla</button>
                </div>
            </td>
        </tr>
        </tbody>
        <tfoot>
                <tr>
                    <td colspan="6" class="text-center">
                        <div st-pagination="" st-items-by-page="itemsByPage" st-displayed-pages="7"></div>
                    </td>
                </tr>
            </tfoot>
    </table>
    
    
    
    </div>
    

    controller.js

    'use strict';
    
    var myPrezziario = angular.module('Prezziario');
    
    myPrezziario.controller('PrezziarioController',
        ['$scope', '$rootScope', '$location','$http',
        function ($scope, $rootScope, $location, $http) {
    
           $scope.selectedPrezzo = '';
    
           $scope.getPrezzi = function()
           {
                $http.get('./api/prezzario/ricerca_prezzario.php').
                    success(function(data) {
                        $scope.prezzi = data;
                        $scope.prezziCollection= data;
                    });
           };
    
           $scope.editPrezzo = function(prezzo)
           {
                $scope.selectedPrezzo = prezzo;
           };
    
           $scope.salvaPrezzo = function(prezzo)
           {
                $http.post('./api/prezzario/aggiorna_prezzo.php', {
                    'id_prezzario' : prezzo.id_prezzario, 
                    'prezzo_azie' : prezzo.prezzo_azie
                    }
                    ).success(function (data, status, headers, config) {
                        $scope.resetPrezzo();
                    });
           };
    
           $scope.resetPrezzo = function()
           {
                $scope.getPrezzi();
                $scope.selectedPrezzo = '';
           };
    
           $scope.go = function ( path ) {
              $location.path( path );
            };  
    
        }]);
    

    ricerca_prezzario.php

    <?php
    require_once '../includes/dbconnector.php';
    
    
    // a query get all the records from the users table
    $sql = 'SELECT a.id_prezzario, a.tariffa, a.descrizione, a.unita_misura, a.prezzo, a.prezzo_azie  FROM sal_d_prezziario a order by a.tariffa';
    
    // use prepared statements, even if not strictly required is good practice
    $stmt = $conn->prepare( $sql );
    
    // execute the query
    $stmt->execute();
    
    // fetch the results into an array
    $result = $stmt->fetchAll( PDO::FETCH_ASSOC );
    
    // convert to json
    $json = json_encode( $result );
    
    // echo the json string
    echo $json;
    ?>
    

    aggiorna_prezzo.php

    <?php
    require_once '../includes/dbconnector.php';
    
    $sql = "update sal_d_prezziario set prezzo_azie = :prezzo_azie where id_prezzario = :id";
    
    $stmt = $conn->prepare($sql);
    $stmt->bindParam(':prezzo_azie', $data->prezzo_azie); 
    $stmt->bindParam(':id', $data->id_prezzario); 
    $stmt->execute();
    ?>
    
    评论

报告相同问题?

悬赏问题

  • ¥15 vscode的问题提问
  • ¥50 切换TabTip键盘的输入法
  • ¥15 可否在不同线程中调用封装数据库操作的类
  • ¥15 微带串馈天线阵列每个阵元宽度计算
  • ¥15 keil的map文件中Image component sizes各项意思
  • ¥20 求个正点原子stm32f407开发版的贪吃蛇游戏
  • ¥15 划分vlan后,链路不通了?
  • ¥20 求各位懂行的人,注册表能不能看到usb使用得具体信息,干了什么,传输了什么数据
  • ¥15 Vue3 大型图片数据拖动排序
  • ¥15 Centos / PETGEM