diff --git a/ng-sample/app/app.ts b/ng-sample/app/app.ts index dca2c3003..794b00cdf 100644 --- a/ng-sample/app/app.ts +++ b/ng-sample/app/app.ts @@ -1,6 +1,5 @@ import "globals"; -import "./modules"; - +// import "./modules"; global.registerModule("./main-page", function () { return require("./main-page"); }); import * as profiling from "./profiling"; diff --git a/ng-sample/app/package.json b/ng-sample/app/package.json index 0279afd39..eac3e23ad 100644 --- a/ng-sample/app/package.json +++ b/ng-sample/app/package.json @@ -1,24 +1,25 @@ { - "name": "tns-template-hello-world", - "version": "1.2.0", - "author": "Telerik ", - "description": "Nativescript hello-world project template", - "license": "BSD", - "keywords": [ - "telerik", - "mobile", - "nativescript", - "{N}", - "tns", - "appbuilder", - "template" - ], - "repository": { - "type": "git", - "url": "git://github.com/NativeScript/template-hello-world.git" - }, - "bugs": { - "url": "https://github.com/NativeScript/template-hello-world/issues" - }, - "homepage": "https://github.com/NativeScript/template-hello-world" -} + "name": "tns-template-hello-world", + "main": "app.js", + "version": "1.2.0", + "author": "Telerik ", + "description": "Nativescript hello-world project template", + "license": "BSD", + "keywords": [ + "telerik", + "mobile", + "nativescript", + "{N}", + "tns", + "appbuilder", + "template" + ], + "repository": { + "type": "git", + "url": "git://github.com/NativeScript/template-hello-world.git" + }, + "bugs": { + "url": "https://github.com/NativeScript/template-hello-world/issues" + }, + "homepage": "https://github.com/NativeScript/template-hello-world" +} \ No newline at end of file diff --git a/ng-sample/app/renderer-test.ts b/ng-sample/app/renderer-test.ts index 9b03f29a4..59b72f6bd 100644 --- a/ng-sample/app/renderer-test.ts +++ b/ng-sample/app/renderer-test.ts @@ -12,20 +12,33 @@ export class TemplatedComponent { }) @View({ directives: [NgIf, NgFor, TemplatedComponent], - template: ` - - - - - - - - - - - - - + template: ` + + + + + + + + + + + + + + + + + + + + + + + + + + `, }) export class RendererTest { diff --git a/ng-sample/tsconfig.json b/ng-sample/tsconfig.json index 3140d1b47..749f7b655 100644 --- a/ng-sample/tsconfig.json +++ b/ng-sample/tsconfig.json @@ -1,39 +1,38 @@ { - "compilerOptions": { - "outDir": "app", - "rootDir": "app", - "module": "commonjs", - "target": "es5", - "inlineSourceMap": true, - "experimentalDecorators": true, - "removeComments": false, - "emitDecoratorMetadata": true, - "noEmitOnError": true - }, - "files": [ - "app/app.ts", - "app/benchmark.ts", - "app/global.d.ts", - "app/main-page.ts", - "app/main-view-model.ts", - "app/modules.ts", - "app/nativescript-angular/application.d.ts", - "app/nativescript-angular/application.ts", - "app/nativescript-angular/dom_adapter.ts", - "app/nativescript-angular/element-registry.d.ts", - "app/nativescript-angular/element-registry.ts", - "app/nativescript-angular/polyfills/array.ts", - "app/nativescript-angular/renderer.ts", - "app/nativescript-angular/view_node.ts", - "app/nativescript-angular/xhr.ts", - "app/nativescript-angular/zone.ts", - "app/nativescript-angular/zone_patch.ts", - "app/profiling.ts", - "app/renderer-test.ts", - "node_modules/tns-core-modules/tns-core-modules.d.ts" - ], - "filesGlob": [ - "node_modules/tns-core-modules/tns-core-modules.d.ts", - "app/**/*.ts" - ] + "compilerOptions": { + "outDir": "app", + "rootDir": "app", + "module": "commonjs", + "target": "es5", + "inlineSourceMap": true, + "experimentalDecorators": true, + "removeComments": false, + "emitDecoratorMetadata": true, + "noEmitOnError": true + }, + "files": [ + "app/app.ts", + "app/benchmark.ts", + "app/global.d.ts", + "app/main-page.ts", + "app/main-view-model.ts", + "app/nativescript-angular/application.d.ts", + "app/nativescript-angular/application.ts", + "app/nativescript-angular/dom_adapter.ts", + "app/nativescript-angular/element-registry.d.ts", + "app/nativescript-angular/element-registry.ts", + "app/nativescript-angular/polyfills/array.ts", + "app/nativescript-angular/renderer.ts", + "app/nativescript-angular/view_node.ts", + "app/nativescript-angular/xhr.ts", + "app/nativescript-angular/zone.ts", + "app/nativescript-angular/zone_patch.ts", + "app/profiling.ts", + "app/renderer-test.ts", + "node_modules/tns-core-modules/tns-core-modules.d.ts" + ], + "filesGlob": [ + "node_modules/tns-core-modules/tns-core-modules.d.ts", + "app/**/*.ts" + ] } \ No newline at end of file diff --git a/src/nativescript-angular/element-registry.ts b/src/nativescript-angular/element-registry.ts index 30e20c89d..62ed17916 100644 --- a/src/nativescript-angular/element-registry.ts +++ b/src/nativescript-angular/element-registry.ts @@ -66,6 +66,7 @@ registerElement("Slider", () => require("ui/slider").Slider); registerElement("StackLayout", () => require("ui/layouts/stack-layout").StackLayout); registerElement("Switch", () => require("ui/switch").Switch); registerElement("TabView", () => require("ui/tab-view").TabView); +registerElement("TabViewItem", () => require("ui/tab-view").TabViewItem); registerElement("TextField", () => require("ui/text-field").TextField); registerElement("TextView", () => require("ui/text-view").TextView); registerElement("TimePicker", () => require("ui/time-picker").TimePicker); diff --git a/src/nativescript-angular/view_node.ts b/src/nativescript-angular/view_node.ts index 25fc6e772..065b2dcb5 100644 --- a/src/nativescript-angular/view_node.ts +++ b/src/nativescript-angular/view_node.ts @@ -13,6 +13,7 @@ import {Switch} from 'ui/switch'; import {LayoutBase} from 'ui/layouts/layout-base'; import gestures = require("ui/gestures"); import {ViewClass, getViewClass, isKnownView} from './element-registry'; +import {isString} from "utils/types"; type EventHandler = (args: EventData) => void; @@ -28,11 +29,11 @@ export class ViewNode { private cssClasses: Map = new Map(); private static whiteSpaceSplitter = /\s+/; - public children:Array = []; + public children: Array = []; constructor(public parentNode: ViewNode, - public viewName: string, - attrNameAndValues: string[]) { + public viewName: string, + attrNameAndValues: string[]) { this.setAttributeValues(attrNameAndValues); if (this.parentNode) @@ -57,7 +58,7 @@ export class ViewNode { return this._parentView if (this.parentNode) { - if(this.parentNode.viewName !== "template" && this.parentNode.nativeView) { + if (this.parentNode.viewName !== "template" && this.parentNode.nativeView) { this._parentView = this.parentNode.nativeView; } else { this._parentView = this.parentNode.parentNativeView; @@ -69,6 +70,10 @@ export class ViewNode { return this._parentView; } + get isComplexProperty(): boolean { + return ViewNode.isComplexProperty(this.viewName); + } + public attachToView(atIndex: number = -1) { console.log('ViewNode.attachToView ' + this.viewName); if (this._attachedToView) { @@ -84,9 +89,11 @@ export class ViewNode { this.children.forEach(child => { child.attachToView(); }); + + this.postAttachUI(); } - private createUI(attachAtIndex: number) { + private createUI(attachAtIndex: number): boolean { if (!isKnownView(this.viewName)) return; @@ -118,12 +125,40 @@ export class ViewNode { } } else if ((this.parentNativeView)._addChildFromBuilder) { (this.parentNativeView)._addChildFromBuilder(this.viewName, this.nativeView); - } else { + } else if (this.parentNode.isComplexProperty) { + // complex property - we will deal with this in postAttachUI() + } + else { console.log('parentNativeView: ' + this.parentNativeView); throw new Error("Parent view can't have children! " + this.parentNativeView); } } + private postAttachUI() { + if (this.isComplexProperty) { + let nativeParent = this.parentNativeView; + if (!nativeParent) { + return; + } + + let propertyName = ViewNode.getComplexPropertyName(this.viewName); + let realChildren = []; + for (let child of this.children) { + if (child.nativeView) { + realChildren.push(child.nativeView); + } + } + if (realChildren.length > 0) { + if (nativeParent._addArrayFromBuilder) { + nativeParent._addArrayFromBuilder(propertyName, realChildren); + } + else { + this.parentNode.setAttribute(propertyName, realChildren[0]); + } + } + } + } + private static propertyMaps: Map> = new Map>(); private static getProperties(instance: any): Map { @@ -142,6 +177,21 @@ export class ViewNode { return ViewNode.propertyMaps.get(type); } + private static isComplexProperty(name: string): boolean { + return isString(name) && name.indexOf(".") !== -1; + } + + private static getComplexPropertyName(fullName: string): string { + var name: string; + + if (isString(fullName)) { + var names = fullName.split("."); + name = names[names.length - 1]; + } + + return name; + } + private configureUI() { if (this.attributes.size == 0) return; @@ -337,7 +387,6 @@ export class ViewNode { this.nativeView.cssClass = classValue; } } - } export class DummyViewNode extends ViewNode {