Question

使用TypeScript开发NativeScript应用程序且后端为Firebase时，列表中未填充Firebase值。

我已经附上了我的代码文件。在将登录页面导航到我的列表页面时，不会显示任何项目。我该如何解决这个问题？

list.model.ts

function indexOf(item) {
  var match = -1;

  this.forEach((loopItem, index) => {
    if (loopItem.id === item.key) {
      match = index;
    }
  });
  return match;
};

function load() {
  var onChildEvent = (result) => {

  var viewModel = new ObservableArray();

  viewModel.indexOf = indexOf;
  var matches = [];

  if (result.type === "ChildAdded") {
    if (result.value.UID === config.uid) {
      viewModel.push({
        name: result.value.Name,
        id: result.key
      });
    }
  } else if (result.type === "ChildRemoved") {
    matches.push(result);
    matches.forEach((match) => {
    var index = viewModel.indexOf(match);

    viewModel.splice(index, 1);
  });
}

};

return firebase.addChildEventListener(onChildEvent, "/Groceries").then(
  () => {
    console.log("firebase.addChildEventListener added");
  },
  (error) => {
    console.log("firebase.addChildEventListener error: " + error);
  })
};

list.ts

var load = require("path");
var pageData = new Observable({
  groceryList: new ObservableArray([])
});

export function loaded (args: observableModule.EventData) {
  var sender = <view.View>args.object;
  var parent = sender.parent;
  var name = <Label>view.getViewById(parent, "name");

  page = args.object;
  page.bindingContext = pageData;
  load();

};

list.xml

<Page loaded="loaded">
<GridLayout rows="auto, *" columns="2*, *">
<TextField id="grocery" text="{{ grocery }}" hint="Enter a grocery item" row="0" col="0" />
    <Button text="Add" tap="addGrocery" row="0" col="1" />
    <ListView id="groceryList" items="{{ groceryList }}" row="1" colSpan="2">
        <ListView.itemTemplate>
        <GridLayout columns="*, auto">
            <Label text="{{ name }}" horizontalAlignment="left" verticalAlignment="center"/>
            </GridLayout>
        </ListView.itemTemplate>
    </ListView>
</GridLayout>
</Page>

Answer 1

关于您提供的信息，请找到以下代码：

/*
 * list.model.ts
 */

 export function load(fnResultCallback) {
    var onChildEvent = (result) => {
        var items = [];
        var matches = [];

        if (result.type === "ChildAdded") {
            if (result.value.UID === config.uid) {
                items.push({
                    name: result.value.Name,
                    id: result.key
                });
            }
        } else if (result.type === "ChildRemoved") {
            matches.push(result);
            matches.forEach((match) => {
                var index = indexOf(match, items);
                items.splice(index, 1);
            };
        }

        fnResultCallback(items);
    };
    firebase.addChildEventListener(onChildEvent, "/Groceries").then(
        () => {
            console.log("firebase.addChildEventListener added");
        },
        (error) => {
            console.log("firebase.addChildEventListener error: " + error);
        });
    }
 }

function indexOf(item, items) {
  var match = -1;

  items.forEach((loopItem, index) => {
    if (loopItem.id === item.key) {
      match = index;
    }
  });
  return match;
};

/*
 * list.ts
 */

var model = require("path");
var pageData = new Observable({
  groceryList: new ObservableArray([])
});

export function loaded (args: observableModule.EventData) {
  var sender = <view.View>args.object;
  var parent = sender.parent;
  var name = <Label>view.getViewById(parent, "name");

  page = args.object;
  page.bindingContext = pageData;
  model.load((result) => {
    pageData.groceryList = new ObservableArray(result);
  });
};

使用NativeScript和TypeScript

1 个答案: