Угловой объект JS не привязан к виду

Question

Угловой объект JS не привязан к виду

0

Вот простой контроллер

Я создаю hardcoded объект в контроллере и хочу связать его в представлении, почему я делаю это сейчас, я хочу работать с представлением данных такого рода.

Я не могу работать над ним, потому что свойства dataObject не отображаются в представлении

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

app.controller('MainController',['$scope',function($scope){

$scope.databOject = { 
    venue:'Hauz Khas Social',
    date:'23-July-2015',
    data:{
        Point1 :{
            people:100,
            females:40,
            music:'EDM',
            musicSrc:'DJ',
            vibe:'upbeat',
            imgUrl:'',
            timeStamp:'',
            coordinates:{Lon:'',Lat:''}
        },
        Point2 :{
            people:100,
            females:40,
            music:'EDM',
            musicSrc:'DJ',
            vibe:'upbeat',
            imgUrl:'',
            timeStamp:'',
            coordinates:{Lon:'',Lat:''}
        },
        Point3 :{
            people:100,
            females:40,
            music:'EDM',
            musicSrc:'DJ',
            vibe:'upbeat',
            imgUrl:'',
            timeStamp:'',
            coordinates:{Lon:'',Lat:''}
        },
        Point4 :{
            people:100,
            females:40,
            music:'EDM',
            musicSrc:'DJ',
            vibe:'upbeat',
            imgUrl:'',
            timeStamp:'',
            coordinates:{Lon:'',Lat:''}
        }
    }
}

} 

}]);

Вот аккуратно выглядящий HTML

  <!Doctype html>
  <html ng-app="NOL">
  <head>

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"> </script>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
 <script src="app.js"></script>

  </head>

  <body class="container" ng-controller="MainController">
      {{dataObject|json}}

      <div class="row">
          <h4>Venue:{{ dataObject.venue }} </h4>
          <h4>Date:{{ dataObject.date }}</h4>

          <input type="text" ng-model="text"> {{text}}

      </div>

  </body>
  </html>

Тем не менее данные не будут связываться

Nirbhay Gupta 22 июль 2016, в 08:42

Источник

0

Вот работающее решение для плунжера plnkr.co/edit/ZK7SHvOXmSAmi8PhgYEk?p=preview .
Sachila Ranawaka 22 июль 2016, в 06:25

Теги:

angularjs

angularjs-scope

1 ответ

Ещё вопросы

Вот работающее решение для плунжера plnkr.co/edit/ZK7SHvOXmSAmi8PhgYEk?p=preview .

Suren Srapyan · Answer 1 · 2016-07-22T03-55-00.000Z

Чтобы узнать, что неправильно, используйте F12 в браузере, и вы увидите, что

не может прочитать свойство неопределенного. dataObject не определен.

Ваша переменная - это $scope.databOject, но вы используете как dataObject. Экстра b в $scope.databObject

 <body class="container" ng-controller="MainController">
      {{dataObject|json}}

      <div class="row">
          <h4>Venue:{{ dataObject.venue }} </h4>
          <h4>Date:{{ dataObject.date }}</h4>

          <input type="text" ng-model="text"> {{text}}

      </div>

  </body>