2016-07-17 2 views
0

Я столкнулся с проблемой с маршрутизацией в mys ListView. Маршрутизация кажется неработоспособной или очень медленной.Маршрутизация в ListView не работает

Вот "HTML" вид:

<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 , - На кнопке справа на мой стоп-лот.

Вот код:

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 }]); 
    } 

Когда я нажимаю на первой кнопке: Everythings идет хорошо и быстро. Если я коснусь других возможностей: маршрутизация не работает. Я должен сделать другое событие, например, привязать панель поиска, чтобы заставить все работать.

Вот мой 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: Я заметил, что я имею два packages.json. Один в моей папке с корневым проектом и второй в моей папке проекта приложения. Кажется, что они не синхронизированы. Это может быть проблемой? Какой из них наконец используется? В этом сообщении я покажу вам проект один.

ответ

0

По моему мнению, существует проблема с тем, как вы используете маршрутизатор. В проекте NativeScript Angular2 вы можете создать объект RouterConfig, который отображает пути к компонентам или использовать router-outlet. Вы можете ознакомиться с статьей this, где описано, как выполнять навигацию в приложении NativeScript с использованием функции «Угловая». Что касается проблемы, вы можете также просмотреть мой образец проекта в this repo

+0

Я изменил свой код. Но я все еще сталкиваюсь с проблемой: если я использую кнопку за пределами списка и возвращаюсь: никаких проблем. Но если я сделаю то же самое в списке и вернусь: метод ngInit моего списка не вызывается ... Поэтому моя страница пуста ... – xiii29

+0

Вы можете попробовать загрузить содержимое ListView в конструкторе или в ListView событие onloaded. Это должно решить вашу проблему с помощью навигации и вашего ListView. В связи с этим я обновил свой примерный проект и добавил ListView на второй странице. –

+0

Не работает также ... И основываясь на том, что я читаю, это должно быть сделано на ngOnInit. Почему он не называется так, как раньше? Я думаю, что я должен перезапустить свой проект, основываясь на изменениях в документе ... Спасибо за вашу помощь. – xiii29

Смежные вопросы