Use simple JavaScript in an ionic application - javascript

I am using ionic to build hybrid app for mobile phones. I have a card type layout in div tag and want to change the functionality of a div to be clickable just like accordion in bootstrap. Where can I put the JS code? Do I need a separate file for the code or need to add it to existing file? (like app.js or controller.js or services.js)
I have tried to put it in app.js but not working.

you can use in html page also using script tag, or you can keep that code into related controller.js. best way is controller.

Related

How to reset css in angular

I'm developing an angular project but I ran into a problem, I want to achieve the following. 1. click a button and open a new window. 2. I don't want the css rules applied to the whole application to have any effect on the pop up new window.
Here's what I have tried.
.ts file
goToLink(url: string){
window.open(url,'', 'scrollbars=yes,width=300, height=300');
}
.html file
<a (click)="goToLink('filter');" >Filter</a>
I want a new look/css in the filter without entire page of the website css
Make a filter component and write its own css. Try not to use any class in the HTML that you have defined globally. This is called ShadowDom

how to use materializejs components with meteor

I use materialize framework for my front-end meteor app.
I have installed materialize package and jQuery package, and I can use componants that use only css but when it came to js componants I can't find where to put the Initialization.
For example I want to add dropdown I take the HTML code and I put it inside my HTML file
enter image description here
After that I didn't know how and where can i put the js or jquery code
enter image description here
So I want to know where and how I use the js or the jquery lines please.

Using JavaScript Plugins with Angular 4

I'm trying to use the Bootstrap 3 Datepicker plugin (http://eonasdan.github.io/bootstrap-datetimepicker/) with Angular 4.0.
I've included the necessary JS and CSS (and a custom JS script calling the plugin) in my angular-cli.json file and the script loads great on the first page that I open but stops working as soon as I route to another component.
I figure that I need a way to call $('.datetime-picker').datetimepicker() every time I route to the new component. How would I do that?
this is a different solution try using primeNg google it.

How to add a navigation sidebar and a footer to an AngularJS template without ng-include.?

I'm new to angular development. I have been using a few paid angular admin themes. In all of them, developers have only added ng-view and ng-class attribute to index.html. I just want to know how to add a sidebar navigation and a footer to every page without using any ng-include.
If you do not want to use ng-include, you can put your HTML directly in the index.html. That is called a layout template, which is the view that contains the common elements along your application.
In summary, everything in index.html outside the ng-view element is going to appear in every page (as long as you use any module such as angular-route for routing within the same original HTML document (e.g. index.html)).
I would recommend you to follow the official AngularJS tutorial if you are new to this framework. Also, ng-book by Ari Lerner is a must-read on this topic.

navigation bar in single page app using angular

I've tried to find the answer to my problem with no luck. I'm new to web development and I've been trying to create a simple app using angularjs and bootstrap. There's no much content on my pages, only a couple of inputs and buttons that do nothing.
I placed ng-view in the index.html page as I saw in many tutorials and that allows me to navigate to all my pages. I'm trying to add a navigation bar to all my pages once a user logs in, so I placed another ng-view on my home(page after user logs in), but it seems that angular allows only one view for each app. And also it doesn't allow nested app. If I'm wrong, please correct me (that's what I understood from my Google 'research').
So, my question is: how can I add a navigation bar(or any same html content) to all my pages after the user logs in without copying the same code in each html page?
Btw, I had this working with jQuery, but I don't know how to do it using angularjs
Thanks!
You can use Angular Directive that use a template to create a custom tag and you can use a controller only for this directive. Call this tag to all pages when logging.

Categories