Question

在html

上绑定时变量为空

HTML code：

<html lang="en" ng-app="roomInfo">
...

<div id="modal" ng-controller="roomListCtrl" class="modal fade">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">{{ room[0].name }}

JS代码：

 var roomInfo = angular.module('roomInfo', []);

roomInfo.controller('roomListCtrl', function ($scope, $http) {

    $http.get("/room-list-info/").then(function(response) {
        $scope.rooms = response.data;
    });

    $scope.getRoom = function (id) {
        var url = "/room-info/"+ id +"/";
        console.log(id);
        $http.get(url).then(function(response) {
            $scope.room = response.data;
            console.log($scope.room[0].name + "hola");
        });
    };


});

console.log（）显示了我想要的信息但由于某种原因它不会转到html 房间[0] .name也只用于房间[0] .name不起作用

Answer 1

一开始$ scope.rooom [0]未定义，因此当你想要room [0] .name时会发生角度崩溃。试试这个{{ room[0] ? room[0].name: '' }}

Answer 2

看起来你在Angular上下文之外调用$ scope.getRoom。您需要使用像ng-click这样的Angular绑定，或者手动执行$ scope。$ apply。

在html中调用时，ng-binding，$ scope变量为空

2 个答案: