CODEWITHSUNDEEP
androidnativescriptandroid-textinputlayoutangular2-nativescript
Omar Essam
Omar Essam

Reputation: 85

NativeScript floating hint

I was creating a form in nativescript and I wanted my fields to have floating hints just like TextInputLayout and I found this plugin nativescript-textinputlayout which techincally does exactly what I want, but the problem is that I am usign angular 2 with my application, and I can't seem to figure out how to use that plugin with angular 2. Can someone help with that? I am also open to other solutions other than using the plugin to implement floating hints

Upvotes: 1

Views: 1669

Answers (2)

Aditya
Aditya

Reputation: 98

@rajlaxmi_jagdale looks like there is a problem in a recent update...

remove below line from mode_modules/nativescript-textinputlayout/textInputLayout.d.ts

export const iconFontProperty: Property;

it will work!!

Upvotes: 0

Dimitar Rusev
Dimitar Rusev

Reputation: 196

nativescript-textinputlayout is a "vanilla" NativeScript component. In order to use it with Angular, you need to register it as a valid tag for Angular templates using the element registry API.

Example:

my-component.component.ts

import { registerElement } from "nativescript-angular/element-registry";

registerElement("TextInputLayout", () => require("nativescript-textinputlayout").TextInputLayout);

@Component({
   selector: "my-component",
   moduleId: module.id,
   templateUrl: "./my-component.component.html"
})
export class MyComponent {}

my-component.component.html

<StackLayout>
   <TextInputLayout hint="my hint" hintAnimationEnabled="true">
      <TextField text="my content"></TextField>
   </TextInputLayout>
</StackLayout>

Upvotes: 5

Related Questions