NativeScript-Ampersand

一个 NativeScript 模块，用于添加 Ampersand.js 模型 和 REST 集合，以替代 nativescript observables 使用。Ampersand.js 是 Backbone.js 的分支，提供了许多相同的功能以及额外的特性。所有服务器同步方法都可用，并且默认使用内置的 Nativescript http 模块。有关 Ampersand.js 的更多信息，请参阅他们的 文档。

[![NPM版本][npm-image]][npm-url] [![依赖状态][david-dm-image]][david-dm-url] [npm-url]: https://npmjs.net.cn/package/nativescript-ampersand [npm-image]: http://img.shields.io/npm/v/nativescript-ampersand.svg [david-dm-url]: https://david-dm.org/dapriett/nativescript-ampersand [david-dm-image]: https://david-dm.org/dapriett/nativescript-ampersand.svg

安装

从您的 NativeScript 项目运行 npm install nativescript-ampersand --save

使用

模型

只需使用 require("nativescript-ampersand/model") 来引入 AmpersandModel，然后为您自己的模型扩展它。有关可用方法和配置选项，请参阅 Ampersand 模型文档。

// ./app/models/todo.js

var AmpersandModel = require("nativescript-ampersand/model");

module.exports = AmpersandModel.extend({

  urlRoot: "http://www.example.com/todos",

	// Properties this model will store
	props: {
		title: {
			type: 'string',
			default: ''
		},
		completed: {
			type: 'boolean',
			default: false
		}
	},
	// session properties work the same way as `props`
	// but will not be included when serializing.
	session: {
		editing: {
			type: 'boolean',
			default: false
		}
	},
	destroy: function () {
		if (this.collection) {
			this.collection.remove(this);
		}
	}
});

然后只需在视图中使用它们。您可以将其设置为视图的 bindingContext，它们会自动更新以反映模型的变化。

// ./app/views/todo-view.js
var TodoModel = require( "../models/todo" );

var todo = new Todo({
  title: "Enter new TODO"
});

exports.load = function(args){
  args.object.bindingContext = todo;
}

exports.save = function() {
   todo.save();
}

REST 集合

只需使用 require("nativescript-ampersand/collection") 来引入 AmpersandRestCollection，然后为您自己的集合扩展它。

// ./app/collections/todo-collection.js

var AmpersandCollection = require("nativescript-ampersand/collection");
var TodoModel = require("../models/todo")

module.exports = AmpersandCollection.extend({
  url: "http://www.example.com/todos",
  model: TodoModel
});

然后只需在视图中使用它们。您可以将其绑定到列表视图中，并且它们会自动更新以反映集合的变化。

// ./app/views/todos.js
var TodoCollection = require( "../collections/todo-collection" );

var todos = new TodoCollection();

exports.load = function(args){
  args.object.bindingContext = {todos: todos};
  todos.fetch();
}

exports.refresh = function() {
   todo.fetch();
}

<!-- ./app/views/todos.xml -->
<Page navigatedTo="load">
	<StackLayout>
    <ListView items="{{ todos }}">
        <ListView.itemTemplate>
        	<GridLayout rows="50">
            <Label text="{{ title }}" />
          </GridLayout>
        </ListView.itemTemplate>
    </ListView>
  </StackLayout>
</Page>