javascript - Angular 应用程序不显示 $scope 数据

Question

我正在尝试设置一个基本的 Angular 应用程序来测试一些翻译逻辑，但不知何故我无法让我的数据显示在前端。

这是我的 html:

<div ng-app="testApp">
  <div ng-controller="myController">
    <p >{{ title }}</p>
    <p >{{ text }}</p>
  </div>
</div>

还有我的 JS:

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

testApp.controller('myController', function ($scope) {
  $scope.data = {
    title: 'PAGE_TITLE',
    text :'some random page text'
  };
});

我创建了一个 codepen ，添加了 reset.css、jQuery 和 AngularJS 作为依赖项，但无法弄清楚我做错了什么。

感谢任何帮助。

Answer 1

您应该将 data 对象的那些属性绑定(bind)为 title 并且 text 属于该 data 对象。

标记

<div ng-app="testApp">
  <div ng-controller="myController">
    <p >{{ data.title }}</p>
    <p >{{ data.text }}</p>
  </div>
</div>