javascript - Ui-router、ng-repeat 和 ui state

Question

我正在开发一个应用程序，在创建资源后我需要将当前用户重定向到不同的状态。

实际上，我有一个需求列表，我需要根据该需求显示或创建报价。

这是查看代码:

<div class="landing-diags">
  <div class="current-projects">
    <div class="row project-summary" ng-repeat="demand in landingdiag.demandsList">
      <div class="col-md-2 project-block first-block {{project.projectType}}">
        <p class="project-strong">{{demand.user.firstname}} {{demand.user.lastname}}</p>
      </div>
      <div class="col-md-2 project-block">
        <p class="project-strong">{{demand.creationDate | date:"dd/MM/yyyy"}}</p>
      </div>
      <div class="col-md-4">
      </div>
      <div class="col-md-2">
        <div ng-if="!demand.quotation">
          <button ng-click="landingdiag.createQuotation(demand)" class="btn btn-primary pull-right bar-btn">Create</button>
        </div>
        <div ng-if="demand.quotation">
          <button ui-sref="app.state.concerned({id: demand._id})" class="btn btn-primary pull-right bar-btn">Show</button>
        </div>
      </div>
    </div>
  </div>
</div>

这是隐含的 Controller 方法:

createQuotation (demand) {
    this.DemandsService.createQuotation(demand).$promise.then((response) => {
      this.redirectToQuote(demand);
    });
  }

redirectToQuote (demand) {
  this.$state.transitionTo('app.state.concerned', {id: demand._id});
}

问题

我的问题是在创建报价时我从未被重定向。如果我控制台记录redirectToQuote方法，我会在其中传递。所以看来我的问题出在 $state.go 调用上。

但是，当我尝试使用“显示”按钮上的 View 内的redirectToQuote方法直接重定向时，如下所示:

<div ng-if="demand.quotation">
  <button ng-click="landingdiag.redirectToQuote(demand)" class="btn btn-primary pull-right bar-btn">Accéder au devis</button>
</div>

我已被重定向到相关状态

Answer 1

我担心 createQuotation() 中的 this.redirectToQuote，它由 then() 作为回调调用。因此 this 对象肯定不会成为您的 Controller 。

看一下 todd 的第一个代码片段:https://toddmotto.com/resolve-promises-in-angular-routes/ 他正在使用绑定(bind)。

您还可以查看https://github.com/getify/You-Dont-Know-JS/tree/master/this%20%26%20object%20prototypes来自出色的凯尔·辛普森 或更短的我自己:http://blog.monkey-development.com/javascript/java/2015/12/18/javascript-this.html