i got this error:-
Error: Template parse errors:
There is no directive with "exportAs" set to "mdbModal" ("k)="basicModal.show()" mdbWavesEffect>Launch demo modal
Related
I'm trying to do upgrade components written in AngularJS1 to Angular6. I'm taking the approach of having the wrappers for all the existing AngularJS1 component by extending "UpgradeComponent" placed under the folder "directive-wrappers" in my example. I have written this application in my local and it works fine for 2 components TestDirectiveWrapper and TestDirective2Wrapper.
But when I include the third component TestDirective3Wrapper, while loading the application I get the console error as
angular.min.js:127 Error: [$injector:unpr] http://errors.angularjs.org/1.7.5/$injector/unpr?p0=testDirective3DirectiveProvider%20%3C-%20testDirective3Directive
at angular.min.js:7
at angular.min.js:46
at Object.d [as get] (angular.min.js:43)
at angular.min.js:46
at Object.d [as get] (angular.min.js:43)
at Function.push../node_modules/#angular/upgrade/fesm5/static.js.UpgradeHelper.getDirective (static.js:872)
at new UpgradeHelper (static.js:869)
at TestDirective3Wrapper.UpgradeComponent (static.js:1170)
at new TestDirective3Wrapper (TestDirective3Wrapper.ts:9)
at createClass (core.js:9296) "<app-root _nghost-c0="">"
To mimic the same application online I have created the same angularjs directives and its wrappers in stackblitz, but here I'm getting a different error though.
Can anyone help me in resolving this issue and enable me to load all the 3 components?
I had a play with this, and I managed to get it to work.
There were a few things missing.
You didn't actually include the AngularJS 1.x file.
You didn't import the original AngularJS app module file, or any of the directives.
Once I did those two things, it worked for me.
Here is the relevant code:
In app.module.ts:
import '../AngularJsApp/app.module'; // added
declare var angular: any; // added
angular
.module('testApp')
.directive('appRoot', downgradeComponent({ component: AppComponent }));
In AngularJsApp/app.module.js:
'use strict';
const angular = require('angular'); // added
// Define the `testApp` module
angular.module('testApp', []);
// added these 3 lines
require('./test-directive/test-directive.js');
require('./test-directive2/test-directive2.js');
require('./test-directive3/test-directive3.js');
I am trying to test if an Angular ng-click link is being clicked with Geb. Link does not really navigate anywhere, so test should stay on the same page. But seems that test can't find my link definition on my Geb UI page.
Angular:
<a ng-click="menuAction('open')">...</a>
Geb UI Page "MainPage":
openLink { $("a", "ng-click":"menuAction('open')") }
Test:
given:
to MainPage
when:
openLink.click()
then:
at MainPage
Getting the following error:
org.openqa.selenium.WebDriverException: unknown error: Element is not clickable at point (898, 147). Other element would receive the click: <div ng-show="processing" class="my-new-container ng-scope">...</div>
Found similar problem here.
Testing Angular dynamic page content (ng-if) with Geb
But unfortunately it did not help me to resolve my problem.
Appreciate any help!
This was solution to my problem.
openLink(to: OtherPage) { $("a", "ng-click": "menuAction('open')") }
I am migrating an application from Angular1 to Angular2, in which I used the svg.js library to draw an SVG. Some elements of the SVG contained "ng-click" directives, that I made the SVG library print to the final SVG.
That worked alright in Angular1, however, now the directive is called "(click)" and everything breaks. I traced the SVG sources and found that the following call
this.node.setAttribute(attr, value.toString())
results in the following error message:
VM22161:1 Uncaught DOMException: Failed to execute 'setAttribute' on 'Element': '(click)' is not a valid attribute name.(…)
Any ideas to solve that problem? Patching the SVG source would be ok for me, if there's no other way.
A valid and quick workaround is to use the binding syntax of Angular2, that allows to use "on-click" instead of "(click)".
I am getting the following error when I am trying to run tabs application and is not working. Please find the plunker. Can any one help me to make it work?
Error: enTabsController is undefined
I am using the code from https://github.com/nervgh/angular-tabs with few modifications but some how it is not working.
Your html is wrong.
The end of '' is at a wrong place.
Correct this and then put: require: '^enTabs' in your directives enTabPane and enTab.
<en-tabs data-container="myContainName">
<en-tab data-pane="myPaneName1" >Tab #1</en-tab>
<en-tab data-pane="myPaneName2">Tab #2</en-tab>
<en-tab data-pane="myPaneName3">Tab #3</en-tab>
<en-tab-pane data-name="myPaneName1">
...
</en-tab-pane>
</en-tabs>
See the plunker : http://plnkr.co/edit/sX3kzw?p=preview
I have a tabbed control in a page. I am getting the following error when I pass between tabs:
Error: [$location:ihshprfx] Invalid url "http://backoffice.localhost:3000/#tab_category", missing hash prefix "#!"
Tabs are still working, but browser logs error each time I change tabs.
What should I do in order to avoid those errors?
If you are not already, use Angular Bootstrap, here are the instructions for the tab controller. Using the the tabset directive you will not have to split the tabbar from its contents and the directive handles showing and hiding the tab panels.