AngularJS – (使用Ionic框架) – 头标题上的数据绑定不起作用

我正在使用一个名为“Ionic”的基于AngularJS的库( http://ionicframework.com/)。

这似乎很简单，但对我来说并不奏效。

在我看来，我有以下几点

<view title="content.title">
  <content has-header="true" padding="true">
    <p>{{ content.description }}</p>
    <p><a class="button button-small icon ion-arrow-left-b" href="#/tab/pets"> Back to home</a></p>
  </content>
</view>

在上述观点的控制器中，我有

angular.module('App',[]).controller('DetailCtrl',function($scope,$stateParams,MyService) {

  MyService.get($stateParams.petId).then(function(content) {
    $scope.content = content[0];
    console.log($scope.content.title); // this works!
  });
});

此视图的数据通过简单的HTTP GET服务(称为MyService)加载。

问题是当我查看此页面时，

<view title="content.title">

不显示标题。这只是一个空白。根据离子文件(http://ionicframework.com/docs/angularjs/controllers/view-state/)，我认为我做正确的事情。

很奇怪，“{{content.description}}”部分作品，但“content.title”不起作用？

另外，是因为我正在动态地加载内容(通过HTTP GET)吗？

以下是Ionic如何完成此工作的一个例子。打开菜单，然后点击“关于”。当“关于”页面转换时，您将看到已解决的标题。

如Florian所说，您需要使用服务并解决以获得所需的效果。然后将返回的结果注入控制器。这有一些不利的一面。国家供应商将不会改变路线，直到承诺得到解决。这意味着用户尝试更改位置和实际发生的时间可能会有明显的滞后。

http://plnkr.co/edit/p9b6SWZmBKWYm0FIKsXY?p=preview