AngularJS -(使用 Ionic 框架) - 标题标题上的数据绑定不起作用 [英] AngularJS - (using Ionic framework) - data binding on header title not working

问题描述

我使用的是基于 AngularJS 的库，名为Ionic"(http://ionicframework.com/).

I'm using an AngularJS-based library called "Ionic" (http://ionicframework.com/).

这看起来很简单，但对我不起作用.

This seems simple, but it isn't working for me.

在我的一个观点中，我有以下几点

In one of my views, I have the following

<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>

在上述视图的控制器中，我有

In the controller for the above view, I have

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)加载.

The data for this view is loaded via a simple HTTP GET service (called MyService).

问题是当我查看这个页面时，

The problem is that when I view this page,

<view title="content.title">

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

Doesn't display the title. It's just a blank. According to the Ionic documentation (http://ionicframework.com/docs/angularjs/controllers/view-state/), I think I'm doing the right thing.

奇怪的是{{content.description}}"部分有效，但content.title"无效?

It's strange that "{{content.description}}" part works, but "content.title" doesn't work?

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

Also, is it because I'm loading the content dynamically (via HTTP GET)?

推荐答案

这是一个如何在 Ionic 中完成此操作的工作示例.打开菜单，然后单击关于".当关于"页面转换时，您将看到已解析的标题.

Here's a working example of how to accomplish this in Ionic. Open the menu, then click "About". When the "About" page transitions, you will see the title that was resolved.

正如 Florian 所指出的，您需要使用服务并解析才能获得所需的效果.然后将返回的结果注入控制器.这有一些不利的方面.状态提供者在 promise 被解决之前不会改变路由.这意味着用户尝试更改位置的时间与其实际发生的时间可能存在明显的延迟.

As Florian noted, you need to use a service and resolve to get the desired effect. You then inject the returned result into the controller. There are some down sides to this. The state provider will not change the route until the promise is resolved. This means there may be a noticeable lag in the time the user tries to change location and the time it actually occurs.

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

这篇关于AngularJS -(使用 Ionic 框架) - 标题标题上的数据绑定不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！