2017-11-02 20 views
0

ハードコードされた配列リストとその作業の良さからデータを表示するためにリストビューを作成しようとしていますが、ユーザーがこのアイテムの詳細を別のページに表示する方法それをしてもいいですか ?私は、詳細については、別の配列を作成し、BindingContextをし、その作業良いを作ってみましたが、私は、コンソールでこのエラーメッセージが表示されます。私のコードのthatsNativescript Binding:プロパティ: 'name'が無効か存在しません。 SourceProperty: 'name'

Binding: Property: 'name' is invalid or does not exist. SourceProperty: 'name' 

メインビュー-model.js:

var Observable = require("data/observable").Observable; 

function RegisterViewModel() { 
    var viewModel = new Observable(); 
    viewModel.shows = [ 
     {name:"Reg1"}, 
     {name:"Reg2"}, 
     {name:"Reg3"}, 
     {name:"Reg4"}, 
     {name:"Reg5"}, 


    ]; 

    return viewModel; 

} 

exports.RegisterViewModel = RegisterViewModel; 

メインpage.js:

var RegisterViewModel = require("./main-view-model").RegisterViewModel; 
var frameModule = require('ui/frame'); 


var viewModel = new RegisterViewModel(); 
function RegisterViewModel(args) { 
var page = args.object; 
page.bindingContext = RegisterViewModel(); 
} 

exports.getInfo = function (args) { 
    var navigationEntry = { 
    moduleName: "RegisterDetails", 
    context: {info:args.view.bindingContext} 
     } 
     frameModule.topmost().navigate(navigationEntry); 
    } 

exports.loaded = function(args){ 
    args.object.bindingContext = viewModel; 
} 


exports.RegisterViewModel = RegisterViewModel; 

メインpage.xml:

詳細については、
<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="onNavigatingTo" class="page" loaded="loaded"> 

    <Page.actionBar> 
     <ActionBar title="My App" icon="" class="action-bar"> 
     </ActionBar> 
    </Page.actionBar> 

    <StackLayout class="p-20"> 

<SearchBar id="searchBar" hint="Search" text="" clear="onClear" submit="onSubmit" /> 
<TabView> 
    <TabView.items> 
    <TabViewItem title="register"> 
     <TabViewItem.view> 
      <ListView items="{{shows}}" tap="getInfo" > 

      <ListView.itemTemplate> 
       <Label text="{{name}}" /> 

      </ListView.itemTemplate> 

     </ListView> 
     </TabViewItem.view> 
    </TabViewItem> 
    <TabViewItem title="Tab 2"> 
     <TabViewItem.view> 
      <Label text="Label in Tab2" /> 
     </TabViewItem.view> 
    </TabViewItem> 
    </TabView.items> 
</TabView> 

    </StackLayout> 
</Page> 

これら:

RegisterDetails-model.js

viewModel.shows = [ 
     {name:"Reg01"}, 
     {name:"Reg02"}, 
     {name:"Reg03"}, 
     {name:"Reg04"}, 
     {name:"Reg05"}, 

    ]; 
    return gotData; 

} 

exports.pageLoaded = pageLoaded; 

RegisterDetails.js:

var gotData; 
function pageLoaded(args) { 
    var page = args.object; 
    gotData = page.navigationContext.info; 
    page.bindingContext={passedData:gotData} 
    } 

    exports.pageLoaded = pageLoaded; 

RegisterDetails.xml:

<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="onNavigatingTo" class="page" loaded="pageLoaded"> 

     <Page.actionBar> 
      <ActionBar title="Register" icon="" class="action-bar"> 
      </ActionBar> 
     </Page.actionBar> 

     <StackLayout > 
        <Label text="{{name}}" /> 
     </StackLayout> 
    </Page> 

しかし、とき、私は詳細を登録するために行くの任意の項目をクリックしたが、データがページに示していない、と私はコンソールでこのメッセージのエラーを受け取った:

JS: Binding: Property: 'name' is invalid or does not exist. SourceProperty: 'name' 

任意のヘルプ?

+0

を見つけることができますか?あなたは 'RegisterDetails.xml'ファイルでそれを参照していますが、それを定義していないようです。また、ドキュメントごとに、ListViewのタップイベントは 'tap'ではなく' itemTap'でなければなりません。 –

+0

RegisterDetailsに 'name'プロパティを追加するには?私は '名前'プロパティにアクセスするために 'var gotdata'を使用しました。 –

答えて

1

全作業のデモは、上記の問題を解決し、詳細な回答は変数 `name`のは、あなたの` RegisterDetails.js`ファイルで参照されhere