search

manfredsteyer / ngUpgrade-without-preparation

24 stars 19 forks source link

Inject module errror #1

Open udayannayak opened 5 years ago

udayannayak commented 5 years ago

Hello,

I am trying to run app as mentioned here. But my angular js directive is not loading. Please see my code as below.

testDirective.js

angular.module('myApp').directive('test-comp', [function () {
    return {
        restrict: 'EA',
        transclude: false,
        scope: {
        },
        link: function ($scope, element, attrs) {
            $scope.name = "123 Testing";
        },
        templateUrl: 'testView.html'
    };
}]);

testView.html

<h1>Hello!</h1>
{{name}}

index.html

<body ng-app="myApp">

    <test-comp></test-comp>
    <app-root></app-root>

</body>

The problem is, when ng-App is added in html is gives error in console as Uncaught Error: [$injector:modulerr] Failed to instantiate module

If I remove ng-App from body it does not give me error but ng1 directive is not showing on screen.

Could you please let me know what I can do to run my ng1 directive?

dev-dk commented 5 years ago

Hello,

I am trying to run app as mentioned here. But my angular js directive is not loading. Please see my code as below.

testDirective.js

angular.module('myApp').directive('test-comp', [function () {
    return {
        restrict: 'EA',
        transclude: false,
        scope: {
        },
        link: function ($scope, element, attrs) {
            $scope.name = "123 Testing";
        },
        templateUrl: 'testView.html'
    };
}]);

testView.html

<h1>Hello!</h1>
{{name}}

index.html

<body ng-app="myApp">

    <test-comp></test-comp>
    <app-root></app-root>

</body>

The problem is, when ng-App is added in html is gives error in console as Uncaught Error: [$injector:modulerr] Failed to instantiate module

If I remove ng-App from body it does not give me error but ng1 directive is not showing on screen.

Could you please let me know what I can do to run my ng1 directive?

I am facing the same issue. Can't load my landing page.

udayannayak commented 5 years ago

@dev-dk can you please explain your problem in details? May be i can help you with that.

dev-dk commented 5 years ago

image I've attached the folder architecture of my application. I've modified the index.html based on the article. in app.module.ts `import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { UpgradeModule, downgradeComponent } from '@angular/upgrade/static'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component';

@NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, AppRoutingModule, UpgradeModule ], providers: [], // bootstrap: [AppComponent] }) export class AppModule { constructor(private upgrade: UpgradeModule) { } ngDoBootstrap() { this.upgrade.bootstrap(document.body, ['reentry']); } } ` After removing the ng-app tag in index.html the error shows 404 error which tells me landing page not found which is under ng1/views directory