Question

我在mysViewView中遇到路由问题。路由似乎不起作用或非常慢。

这是＆＃34; html＆＃34;观点：

<ActionBar [title]="'TITLE' | translate" >
  <ActionItem [text]="'SETTINGS' | translate " (tap)="settings()"
    android.systemIcon="ic_menu_share_holo_dark"
    ios.systemIcon="9"
    ios.position="right">
  </ActionItem>
</ActionBar>
<GridLayout rows="auto, auto, *">

  <SearchBar [(ngModel)]="search" [hint]="'SEARCH' | translate" row="0"
    (submit)="searchSubmit()"
    (clear)="searchClear()"
    #searchFilter (keyup) = "0"
  ></SearchBar>

  <Button **(tap)="select(null)"** row="1" ></Button>

  <!--<ListView [items]="groceryList" row="1" class="small-spacing"> -->
  <ListView [items]="signalList | signalFilter:search " row="2" class="small-spacing" [class.visible]="listLoaded">
    <template let-item="item">
      <GridLayout rows="*"  columns="50px, *, auto"   >
          <Image col="0" [src]="item.image | signalImage " stretch="none"
              horizontalAlignment="center" verticalAlignement="center"
              ></Image>
          <StackLayout col="1" **(tap)="select(item)"** >
            <Label [text]="item.name" class="medium-spacing" class="list-title"></Label>
            <Label [text]="item.description | slice:0:150" class="list-description" textwrap="true" ></Label>
          </StackLayout>
          <Button col="2" text="See" **(tap)="select(item)"** ></Button>
        </GridLayout>
    </template>
  </ListView>

  <ActivityIndicator [busy]="isLoading"
        [visibility]="isLoading ? 'visible' : 'collapse'"
          row="1"
          horizontalAlignment="center" verticalAlignment="center">
  </ActivityIndicator>

我点了不同的对象： - 在我的搜索栏下方的按钮上（仅供测试） - 在stacklayout上， - 在我的stacklayout右侧的按钮上。

以下是代码：

select(signal : Signal) {
      console.dump(signal);
      // For the debug ...
      let id:string = "2";
      //if(signal != null) { id = signal.id; }
      this._router.navigate(["View", { id: id }]);
  }

当我点击第一个按钮时：一切都很顺利。如果我点击其他可能性：路由不起作用。我要做另一个事情，比如在搜索栏中绑定以使事情有效。

这是我的package.json：

{
  // [...]
  },
  "dependencies": {
    "@angular/common": "2.0.0-rc.4",
    "@angular/compiler": "2.0.0-rc.4",
    "@angular/core": "2.0.0-rc.4",
    "@angular/platform-browser": "2.0.0-rc.4",
    "@angular/platform-browser-dynamic": "2.0.0-rc.4",
    "@angular/platform-server": "2.0.0-rc.4",
    "@angular/router-deprecated": "2.0.0-rc.2",
    "nativescript-angular": "0.2.0",
    "nativescript-ng2-translate": "^1.1.0",
    "ng2-translate": "^2.2.2",
    "tns-core-modules": "^2.1.0"
  },
  "devDependencies": {
    "babel-traverse": "6.10.4",
    "babel-types": "6.11.1",
    "babylon": "6.8.4",
    "filewalker": "0.1.3",
    "lazy": "1.0.11",
    "nativescript-dev-typescript": "^0.3.2",
    "typescript": "^1.8.10"
 }
}

Ps：我注意到我有两个package.json。一个在我的根项目文件夹中，另一个在我的app项目文件夹中。他们似乎没有同步。愿这个麻烦吗？最后使用哪一个？在这篇文章中，我向您展示了项目一。

Answer 1

在我看来，您使用路由器的方式存在问题。在NativeScript Angular2项目中，您可以创建RouterConfig对象，将路径映射到组件或使用router-outlet，您可以查看this文章，其中描述了如何使用NativeScript应用程序进行导航角。关于问题，您还可以在this repo

中查看我的示例项目

ListView中的路由无法正常工作

1 个答案: