I am talking about Angular 1.x directives that do not have a template. Directives with the restrict property set to 'A' (attribute directive).
I can't find any documenten on how to upgrade these directives from Angular 1.x to an Angular 5 directive. Is this at all possible? If so how?
I am using UpgradeModule from '#angular/upgrade/static'. Upgrading and downgrading of regular components and services is working fine.
Related
Does i18n or ngx-translate work on Angular 1.5 (below Angular2)?
For angular 1.x version can use
https://www.npmjs.com/package/angular-translator
ngx-translate works with angular2 and above. However you can use
https://github.com/angular-translate/angular-translate
with angular 1.x versions
This is strange, I was downgrading a lot of components from Angular 2 to Angular 1 app and everything working great. I was thinking directive will work too, but seems they don't?
This is my downgrade of directive:
angular.module('myApp')
.directive('tooltip', downgradeComponent({component: TooltipDirective, inputs: ['tooltip', 'placement']}) as angular.IDirectiveFactory);
Thats not helping. I know that directive is a component without a template, but it still a component.
I am looking for the angular directive for bootstrap-datepicker https://bootstrap-datepicker.readthedocs.io/en/latest/
I tried finding it but couldn't get success with that.
Does anyone know the angular directive of the plugin I mentioned?
Are there any conflicts between Angular UI-Bootstrap and Twitter Bootstrap?
I am trying to avoid using jQuery-UI with AngularJS if a more Angular-friendly UI package is available. I already started with Twitter Bootstrap, so I do not wish to unload Twitter Bootstrap.
No, there are no conflicts. Especially since ui-bootstrap is dependent on Twitter Bootstrap.
From the linked docs:
This repository contains a set of native AngularJS directives based on Bootstrap's markup and CSS. As a result no dependency on jQuery or Bootstrap's JavaScript is required. The only required dependencies are:
AngularJS (requires AngularJS 1.3.x, tested with 1.3.13). 0.12.0 is the last version of this library that supports AngularJS 1.2.x.
Bootstrap CSS (tested with version 3.1.1). This version of the library (0.13.0) works only with Bootstrap CSS in version 3.x. 0.8.0 is the last version of this library that supports Bootstrap CSS in version 2.3.x.
If you are going all in on Angular then stick with either AngularStrap or Angular UI Bootstrap, do not mix it with Twitter Bootstrap JS library. Both of the Angular projects mentioned utilize the Bootstrap CSS, but they completely replace the Bootstrap JS library, with pretty much all functionality included.
Apart from the unnecessary bloat to load both libraries, you'll end up with issues integrating the Bootstrap JS library with Angular for stuff like model binding.
Here is a working example of Angular-ui-bootstrap typehead working with AngularJS 1.0.5:
http://plnkr.co/edit/me20JzvukYbK0WGy6fn4
The template uses ng-bind-html-unsafe witch is deprecated in AngularJS 1.2.0-rc3.
How can I bind html unsafe in that template? I would have used ng-bind but the filter typeaheadHighlight:query adds tags in match.model.title.
Thanks!
AngularJS removed the ng-bind-html-unsafe tag in its 1.2RC version which breaks the default typeahead template. But you have at least 2 ways to work-around it:
Move to the version 0.6.0 of the angular-ui/bootstrap library that has an equivalent tag named bind-html, here is a working plunk: http://plnkr.co/edit/D84pG1WwutE4lRU46FIs?p=preview
Include the ngSanitize module and use AngularJS built-in ng-bind-html directive: http://plnkr.co/edit/9Q2Zp3BTQbstv9AjvVg4?p=preview