Nativescript listview沒有更新特定視圖

Question

我正在開發一個應用程序來顯示與項目相關的問題列表。 應用程序流程解釋如下：

1. 用戶登錄應用程序。
2. 列出了列出的項目列表的列表視圖（正常工作）。
3. 單擊項目單元格時，將加載與相應項目相關的問題。（即使問題顯示在日志中也不起作用）。

項目和問題都以相同的方式列出，我找不到問題視圖的問題，因為我得到一個空白屏幕而不是列表視圖。

當我通過注釋項目服務API從項目組件調用問題服務API時，我會使用問題列表更新項目列表視圖。 問題服務是項目視圖實現文件的精確副本，但它似乎仍然無法解決。 附加兩個視圖的代碼。

項目視圖

1. projects.html

  <GridLayout> <ListView [items]="projects" class="small-spacing" (itemTap)="onItemTap($event)"> <template let-item="item"> <Label [text]="item.projectName" class="medium-spacing"> </Label> </template> </ListView> </GridLayout> 

2. 項目-list.service.ts

    import {Injectable} from "@angular/core"; import {Projects} from "./projects"; import {ApiBase} from "../../shared/apiBase/apibase"; import {Config} from "../utils/config" import {User} from "../user/user"; var applicationSettings = require("application-settings"); @Injectable() export class ProjectsService extends ApiBase { apiBase : ApiBase; loadProjects(callBack: (responseObject:any, authDetails: String)=>any) { var url =Config.BASE_URL + "/projects.json"; console.log("URL -" + url); console.log("Auth -" + Config.AUTH_DATA_KEY); this.getRequest(Config.AUTH_DATA_KEY, url, callBack); 

   }

    fetchIssues(callBack: (responseObject:any, authDetails: String)=>any) { var url =Config.BASE_URL + "/issues.json?project_id=215" ; console.log("URL -" + url); console.log("Auth -" + Config.AUTH_DATA_KEY); this.getRequest(Config.AUTH_DATA_KEY, url, callBack); 

   }}

3. projects.component.ts

    import {Component, OnInit} from '@angular/core'; import observable = require("data/observable"); import {Projects} from "../../shared/projects/projects"; import {ProjectsService} from "../../shared/projects/projects-list.service"; import {Router} from "@angular/router-deprecated"; var EventBus = require('eventbusjs'); @Component({ selector: "projects", providers: [ProjectsService], templateUrl: "views/projects/projects.html", styleUrls: ["views/projects/projects.css"], }) export class ProjectsPage implements OnInit { projects = []; constructor(private _projectsService: ProjectsService, private _router: Router) {} ngOnInit() { let projectsList = this.projects; var callback = function callback(response) { JSON.parse(response.content).projects.forEach(project => { projectsList.push(new Projects(project.id, project.name)); console.log("project.name - " + project.name); }) } this._projectsService.loadProjects(callback); } public onItemTap(args) { console.log("------------------------ ItemTapped: " + this.projects[args.index].id); this._router.navigate(["IssuesList", {projectID : this.projects[args.index].id}]); } } 

與問題視圖相關的文件也類似。 但由於列表視圖未顯示，我無法弄清楚問題視圖的問題。 與問題視圖相關的文件如下。

1. issues.html

 <GridLayout> <ListView [items]="issues" class="small-spacing" (itemTap)="onItemTap($event)"> <template let-issue="issue"> <Label [text]="issue.issueSubject" class="medium-spacing"></Label> </template> </ListView> </GridLayout> 

1. isseus-list.service.ts

    import {Injectable} from "@angular/core"; import {Issues} from "./issues"; import {ApiBase} from "../../shared/apiBase/apibase"; import {Config} from "../utils/config" var applicationSettings = require("application-settings"); @Injectable() export class IssuesService extends ApiBase { apiBase : ApiBase; fetchIssues(callBack: (responseObject:any, authDetails: String)=>any) { var url =Config.BASE_URL + "/issues.json?project_id=215" ; console.log("URL -" + url); console.log("Auth -" + Config.AUTH_DATA_KEY); this.getRequest(Config.AUTH_DATA_KEY, url, callBack); } } 

2. issues.component.ts

    import {Component, OnInit} from '@angular/core'; import observable = require("data/observable"); import {Issues} from "../../shared/issues/issues"; import {IssuesService} from "../../shared/issues/issues-list.service"; import {Router} from "@angular/router-deprecated"; var EventBus = require('eventbusjs'); @Component({ selector: "issues", providers: [IssuesService], templateUrl: "views/issues/issues.html", styleUrls: ["views/issues/issues.css"], }) export class IssuesPage implements OnInit{ issues = []; constructor(private _issuesService: IssuesService, private _router: Router) {} ngOnInit() { let issuesList = this.issues; var i = 0; var callback = function callback(response) { JSON.parse(response.content).issues.forEach(issue => { issuesList.push(new Issues(issue.id, issue.status.name, issue.tracker.name, issue.tracker.name)); console.log("issue.name - " + issuesList[i].projectName); i++; }) } this._issuesService.fetchIssues(callback); } public onItemTap(args) { console.log("------------------------ ItemTapped: " + this.issues[args.index].id); //this._router.navigate(["IssuesList", {projectID : this.issues[args.index].id}]); } } 

issues.compnent.ts中的console.log（）返回數據，而列表視圖為空白，如上面的屏幕截圖所示。 任何人都可以幫我解決這個問題嗎？ 提前致謝。

Answer 1

在您的ngOnInit您不分配給this.issues新值

因此，請確保您在callback函數中執行此操作

...
issues = [];
var self = this;
...

   var callback = function callback(response) {

      JSON.parse(response.content).issues.forEach(issue => {
     issuesList.push(new Issues(issue.id, issue.status.name, issue.tracker.name, issue.tracker.name));

    self.issues = issuesList;

    i++;
      })
    }
    this._issuesService.fetchIssues(callback);
  }

Answer 2

更新數據radlistview refresh <RadListView #myListView></RadListView>刷新<RadListView #myListView></RadListView>

@ViewChild("myListView") listViewComponent: RadListViewComponent; //每當你更新dataItems中的數據時都使用它this.listViewComponent.listView.refresh();