1

だから私は AngularJS のチュートリアルに取り組んでいるので、これがこれらのタスクを完了する最善の方法ではないことはわかっていますが、これが私が行っているステップです。ビューにデータを読み込もうとしていますが、データが表示されません。私の ng-view と私の ng-route は適切に機能してそこにたどり着きますが、患者.html にアクセスすると、テーブル ヘッダーだけが表示され、情報が表示されません。私は何が欠けていますか？

これが私のモジュールです

(function() {

    var app = angular.module('cbApp', ['ngRoute']);

    app.config(function($routeProvider){
        $routeProvider
            .when('/',{
                controller  : 'MainCtrl',
                templateUrl : 'views/main.html' 
            })
            .when('/patient/:roomId', {
                controller  : 'PatientCtrl',
                templateUrl : 'views/patient.html'
            })
            .otherwise({ redirectTo : '/' });
    });

}());

これが私のコントローラーです

(function() {
    var PatientCtrl = function ($scope, $routeParams) {      

        var roomId = $routeParams.roomId;
        $scope.patient = null;

        //create a function that searches the rooms for id
        function init() {
            var length = $scope.rooms.length;
            for (var i = 0; i < length; i++){
                if ($scope.rooms[i].name === parseInt(roomId)) {
                    $scope.patient = $scope.rooms[i].patient;
                    break;
                }
            }
        }
        $scope.rooms = [
                        { id : 101, name : "101", patient : { id : 1, last: "Ratcliff", first : "Daniel"} },
                        { id : 102, name : "102", patient : { id : 2, last: "Gibson", first : "Mel"} },
                        { id : 103, name : "103", patient : { id : 3, last: "Fey", first : "Tina"} }
                    ]; 
        init();

    }
    //handle DI to avoid minification errors
    PatientCtrl.$inject = ['$scope', '$routeParams'];
    //define the controller in angular
    angular.module('cbApp').controller('PatientCtrl', PatientCtrl);
}());

と私の見解

<h2>Room Details</h2>
<table>
    <tr>
        <th>First Name</th>
        <th>Last Name</th>
    </tr>
    <tr ng-repeat="pt in patient">
        <td>{{ pt.first }}</td>
        <td>{{ pt.last }}</td>
    </tr>
</table>
4

3 に答える 3

1

roomId パラメーターを慎重に int に変換し、それを文字列と 3 等分比較しました。

于 2015-01-28T20:55:40.647 に答える
1

私はあなたのためにプランカーを完成させました。

しかし、これがあなたが達成したいことかどうかはわかりません。

ここで見ることができます：

プランカー 

<tr >
        <td>{{ patient.first }}</td>
        <td>{{ patient.last }}</td>
</tr>

さらに、いくつかのリンクとパス

于 2015-01-28T23:00:26.723 に答える
0

これがあなたのコードの動作中のプランカーです....わずかな変更を加えたものです: plunker

    angular.module('cbApp', ['ngRoute']).
    config(function ($routeProvider) {
       //configure your routes
    });
(function() {
    var PatientCtrl = function ($scope, $routeParams) {      

        var roomId = $routeParams.roomId || 101;
        $scope.patients = [];

        //create a function that searches the rooms for id
        function init() {
            var length = $scope.rooms.length;
            for (var i = 0; i < length; i++){
                if (parseInt($scope.rooms[i].name) === parseInt(roomId)) {
                    $scope.patients.push($scope.rooms[i].patient);
                    break;
                }
            }
        }
        $scope.rooms = [
                        { id : 101, name : "101", patient : { id : 1, last: "Ratcliff", first : "Daniel"} },
                        { id : 102, name : "102", patient : { id : 2, last: "Gibson", first : "Mel"} },
                        { id : 103, name : "103", patient : { id : 3, last: "Fey", first : "Tina"} }
                    ]; 
        init();

    }
    //define the controller in angular
    angular.module('cbApp').controller('PatientCtrl', ['$scope', '$routeParams', PatientCtrl]);
}());
于 2015-01-29T03:00:08.980 に答える