Wie kann ein Picker mit Alloy mit Appcelerator dynamisch gefüllt werden?

Question

Gibt es eine Möglichkeit, einen Picker dynamisch zu füllen? Dies funktioniert für die Option Dialoge:

view.xml:

<OptionDialog id="distributionPointsOptionDialog"> 
<Options> 
    <Option id="{dp}"></Option> 
</Options> 
</OptionDialog> 

controller.js:

var dp = []; 
for (var j in _data) { 
    if (_data[j].country == country) { 
     dp.push(_data[j].city + "-" + _data[j].dp_name); 
     } 
} 
$.distributionPointsOptionDialog.options = dp; 

Gibt es eine Möglichkeit, das gleiche für einen mehrspaltigen Picker zu tun? Ich habe erfolglos versucht, einen Ein-Spalten-Picker zu füllen.

controller.js:

var fs = Ti.Filesystem; 
var installedFonts = fs.getFile(fs.resourcesDirectory+ "/fonts").getDirectoryListing(); 
Ti.API.info("list of resourcesDirectory fonts: " + JSON.stringify(installedFonts)); 
var fonts = []; 
for (var j in installedFonts) { 
    fonts.push(installedFonts[j]); 
} 
$.testPicker.column = fonts; 

views.xml:

<Picker id="testPicker" selectionIndicator="true" height="Ti.UI.SIZE" width="70%" visible="true" zIndex="200" useSpinner="true"> 
<Column> 
    <Row title="{fonts}"></Row> 
</Column> 
</Picker> 

Dies zu einem Fehler führt:

ERROR] :  message = "undefined is not an object (evaluating '$model.__transform')"; 

Answer 1

Es gibt einige falsche Dinge bei der Implementierung.

1. useSpinner Eigenschaft veraltet ist, so entfernen Sie bitte, dass aus dem Code.
2. Die Art, wie Sie Optionen implementieren & Pickers ist ein Prozess der Legierung-Modell-Bindung.
3. Für dynamische Optionen, können Sie einfach unten Code verwenden:

<OptionDialog id="distributionPointsOptionDialog"></OptionDialog> $.distributionPointsOptionDialog.options = ['Helvetica', 'Arial', 'Times New Roman'];

4. <Option id="{dp}"></Option> - diese Syntax für Modelldaten verwendet wird, die Bindung

5. Für Picker verwenden Sie den folgenden Code:

var fonts = []; fonts[0]=Ti.UI.createPickerRow({title:'Helvetica'}); fonts[1]=Ti.UI.createPickerRow({title:'Arial'}); fonts[2]=Ti.UI.createPickerRow({title:'Times New Roman'}); fonts[3]=Ti.UI.createPickerRow({title:'Georgia'}); $.testPicker.add(fonts);

ODER

var column = Ti.UI.createPickerColumn(); column.add(Ti.UI.createPickerRow({ title: 'Helvetica' })); column.add(Ti.UI.createPickerRow({ title: 'Arial' })); column.add(Ti.UI.createPickerRow({ title: 'Times New Roman' })); column.add(Ti.UI.createPickerRow({ title: 'Georgia' })); $.testPicker.columns = [column];

Für Pickers, kurz gesagt, können Sie entweder $ .testPicker.add() Methode, oder Sie können Spalten wie diese $ .testPicker.columns = gesetzt [column1, column2, column1, ...]

lesen Sie hier mehr How to add Columns or Rows in Pickers

oder

How to add column(s) in Picker