Comments (7)
Yes it works. Almost all plugins work with angular native (NativeScript +
angular). You need to registerelement() there are some samples on other
plugins I've done. Check the drawing pad plugin repo for example of NS
angular example.
On Sun, Oct 2, 2016, 6:24 PM Leo9 [email protected] wrote:
Will this work with NativeScript + Angular2?
I'm trying to figure out how I would add
xmlns:FAB="nativescript-floatingactionbutton" in a NativeScript Angular
Page.—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
#32,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFulhI8suXBA6MdmF_9CQqfehsBk2KA9ks5qwD0vgaJpZM4KMJhu
.
from nativescript-floatingactionbutton.
If a plugin doesn't work with angular then it should explicitly say that
its for angular native. Also IMO that's a bad way to do a plugin for
NativeScript bc it excludes plain NativeScript users which are thousands.
At any rate all my plugins and the majority of community plugins work with
angular. So enjoy the hundreds of them :)
On Sun, Oct 2, 2016, 6:40 PM Brad Martin [email protected] wrote:
Yes it works. Almost all plugins work with angular native (NativeScript +
angular). You need to registerelement() there are some samples on other
plugins I've done. Check the drawing pad plugin repo for example of NS
angular example.On Sun, Oct 2, 2016, 6:24 PM Leo9 [email protected] wrote:
Will this work with NativeScript + Angular2?
I'm trying to figure out how I would add
xmlns:FAB="nativescript-floatingactionbutton" in a NativeScript Angular
Page.—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
#32,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFulhI8suXBA6MdmF_9CQqfehsBk2KA9ks5qwD0vgaJpZM4KMJhu
.
from nativescript-floatingactionbutton.
Awesome! Thank you for the info. I'm gonna check it out now.
from nativescript-floatingactionbutton.
Sorry to bug you again about this.. I'm having a hard time trying to get this to show.
I must be missing something simple...
I have my controller like this..
import { Component, OnInit} from "@angular/core";
import { registerElement} from "nativescript-angular/element-registry";
import { Page } from "ui/page";
import { RouterExtensions } from 'nativescript-angular/router';
import observable = require("data/observable");
registerElement("Fab", () => require("nativescript-floatingactionbutton").Fab);
@Component ({
selector : "home",
templateUrl: "./pages/home/home.html",
styleUrls: ["./pages/home/home.css"],
})
export class HomeComponent implements OnInit {
private router;
constructor(page: Page, router: RouterExtensions) {
page.actionBarHidden = false;
this.router = router;
}
ngOnInit(){
......
}
}
And then in my template I did this..
<ActionBar>
<StackLayout horizontalAlignment="center" verticalAlignment="center">
<Label text="Home"></Label>
</StackLayout>
</ActionBar>
<RadSideDrawer #drawer>
<StackLayout tkDrawerContent class="sideStackLayout">
<StackLayout class="sideTitleStackLayout">
<Label text="MY NAME"></Label>
</StackLayout>
<StackLayout class="sideStackLayout">
<Label text="Home" class="sideLabel sideLightGrayLabel"></Label>
<Label text="Another" class="sideLabel"></Label>
</StackLayout>
</StackLayout>
<GridLayout tkMainContent rows="*" columns="*">
<StackLayout id="games" row="1">
.......
</StackLayout>
<FAB:fab #fab (tap)="fabTap()" row="1" icon="res://ic_add_white" rippleColor="#f1f1f1" class="fab-button"></FAB:fab>
</GridLayout>
</RadSideDrawer>
I also made sure to copy over the icon to all the resolution folders and add the CSS.
What can I be missing?
from nativescript-floatingactionbutton.
Any errors? Screenshots?
On Sun, Oct 2, 2016, 7:58 PM Leo9 [email protected] wrote:
Sorry to bug you again about this.. I'm having a hard time trying to get
this to show.
I must be missing something simple...I have my controller like this..
import { Component, OnInit} from "@angular/core";
import { registerElement} from "nativescript-angular/element-registry";
import { Page } from "ui/page";
import { RouterExtensions } from 'nativescript-angular/router';
import observable = require("data/observable");registerElement("Fab", () => require("nativescript-floatingactionbutton").Fab);
@component ({
selector : "home",
templateUrl: "./pages/home/home.html",
styleUrls: ["./pages/home/home.css"],
})
export class HomeComponent implements OnInit {
private router;
constructor(page: Page, router: RouterExtensions) {
page.actionBarHidden = false;
this.router = router;
}
ngOnInit(){
......
}
}And then in my template I did this..
<RadSideDrawer #drawer>
<GridLayout tkMainContent rows="*" columns="*"> <StackLayout id="games" row="1"> ....... </StackLayout> <FAB:fab #fab (tap)="fabTap()" row="1" icon="res://ic_add_white" rippleColor="#f1f1f1" class="fab-button"></FAB:fab> </GridLayout>
I also made sure to copy over the icon to all the resolution folders and
add the CSS.
What can I be missing?—
You are receiving this because you commented.Reply to this email directly, view it on GitHub
#32 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFulhJvq3fSFs82UMCi5Rqn30ZveqlMjks5qwFNQgaJpZM4KMJhu
.
from nativescript-floatingactionbutton.
I'm not getting errors in the console or in the device.
Currently the page just has a title bar and no content as of now.
Is there any other set up I might of missed that may keep it from showing?
from nativescript-floatingactionbutton.
I got it working! ;)
I had to change
<FAB:fab #fab (tap)="fabTap()" row="1" icon="res://ic_add_white" rippleColor="#f1f1f1" class="fab-button"></FAB:fab>
to
<FAB (tap)="fabTap()" row="0" icon="res://ic_add_white" rippleColor="#f1f1f1" class="fab-button"></FAB>
from nativescript-floatingactionbutton.
Related Issues (20)
- Can I remove padding around icon? HOT 1
- Calling js method onCreateView failed HOT 2
- Error when adding the plugin HOT 1
- JS: topmost() is deprecated. Use Frame.topmost() instead. HOT 2
- How to use svg images HOT 2
- Fab is not showing when scroll completes HOT 1
- text is not working. HOT 6
- loadFromFontIconCode() is deprecated HOT 4
- Adapt icon to screen HOT 10
- Styles not applied on app build for production HOT 2
- FAB 2.0.1: font icons have different sizes on different screens HOT 1
- Crash in flexbox-layout.android.js - Right-hand side of 'instanceof' is not an object HOT 5
- NativeScript 7 update HOT 1
- Could not load view for: Fab.ReferenceError: NativeClass is not defined when used with {N} 7 with angular HOT 12
- FAB.TypeError: core_1.Property is not a constructor HOT 5
- Changing color to text does not work HOT 6
- Display the action items when Fab Button is clicked - Nativescript7 Angular10 HOT 3
- @nativescript/core still imported for lower version than NS7
- icon appearing bigger and cannot be resized HOT 2
- App is crashing on NS Angular
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from nativescript-floatingactionbutton.