I'll keep this short.
I'm very new to angularjs and I'm following one of Pluralsights tutorials.
Since the release of the tutorial there are many deprecated built ins that are driving me nuts.
I'm trying to use the following code
angularFormsApp.controller("HomeController",
function ($scope, $location, $uibModal, DataService) {
$scope.showCreateEmployeeForm = function () {
//$location.path('/newEmployeeForm');
$uibModal.open({
templateUrl: 'app/EmployeeForm/efTemplate.html',
controller: 'efController'
});
})
The tutorial is showing to use $modal (which is now deprecated)... I've tried just using $uibModal instead, and when clicking the button, the event is not firing and I'm getting the following error
Error: [$injector:unpr] http://errors.angularjs.org/1.3.0/$injector/unpr?p0=%24animateCssProvider%20%3C-%20%24animateCss%20%3C-%20%24uibModalStack%20%3C-%20%24uibModal
Oh - I also installed angular using NuGet so I have the latest release
The animateCssProvider is only available for angular 1.4+, and you're using 1.3.
From bootstrap UI website:
AngularJS (requires AngularJS 1.4.x or higher, tested with 1.5.3).
0.14.3 is the last version of this library that supports AngularJS 1.3.x and 0.12.0 is the last version that supports AngularJS 1.2.x.
Just update your angular version.
Related
I have replaced angular 1.3.9 to angular 1.6.5 and I got this console error.
Uncaught Error: [$injector:unpr] Unknown provider:
$$asyncCallbackProvider <- $$asyncCallback <- $animate <- compile
I have changed nothing on my main angular code.
All services and controllers are same.
Any kind of hint will be appreciate.
As pointed out by Paul Weber on this thread right here, you need to check if the version of the angular-animate you are using matches the new version of AngularJS you just updated (1.6.5).
If services are injected into your controller, all services should be in array, check it for all.
May this help.
I am trying to fix this problem, but I can't get it to work. I want to include the NgCookies (angular-cookies) into my app, but it's just giving me an error.
I have this:
Including the JS:
<html>
<script src="js/angular1.6.1.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-cookies.js"></script>
</html>
Application controller:
var myApp = angular.module('myApp', ['ionic', 'ui.router', 'ngCordova', 'ngCookies']);
The controller:
myApp.controller('HomeController', ['$scope', '$cookies', function ($scope, $cookies) {
// Retrieving a cookie
$scope.userName = $cookies.userName || "";
// Setting a cookie
$cookies.userName = 'testUser';
}]);
The error I am getting is:
Error: [$injector:unpr] Unknown provider: $cookiesProvider <- $cookies <- HomeController
I am using Angular version 1.6.1 and Angular-Cookies version 1.6.1
I don't know what I am doing wrong here. I checked other questions, but the solutions given there are not working for me. I checked the versions, I checked if I include Angular before Angular-Cookies etcetera. I am out of options now.
It should work as expected if you included the same version of angular and angular-cookie as in this plunkr.
I see that you are injecting ngCordova and i believe that you are using ionic framework in your development. By default, Ionic comes bundle with angularJS and there is no need to include additional angular.js script on top of ionic and you should avoid doing so as it could lead to unexpected break.
I would suggest you to check the angular version that comes bundle with the ionic version you are using and include the same version of angular-cookies with the angular version that comes bundle with ionic.
I'm trying to use ui-bootstrap for Tabs in my application keeping the example on ui-bootstrap's website as reference. For the same I included the js files given in the exapmle which are:
Angular.js, Animate.js, Sanitize.js and BootStrap-tpls.js
But after including these JS Files I'm shown an error:
[$injector:unpr] Unknown provider: $modalStackProvider <- $modalStack
I'm not able to resolve this dependency.
You have some version mismatch.
It used to be $modal, $modalInstance, etc. in old Angular Bootstrap.
Now it is $uibModal, $uibModalInstance, etc.
So check versions of libraries that depends on Angular Bootstrap.
I've been working on setting up Visual Studio Code specifically to work with a Angular 1.5 codebase that we have at work. Here's what I've done up to this point:
Installed TSD
Ran tsd query -r -o -a install angular -s
Add a reference at the top of my file to tsd.d.ts like so:
/// <reference path="../typings/tsd.d.ts" />
(function() {
'use strict';
angular.module('moduleName').controller('CtrlName',
['$scope', '$window',function ($scope, $window){
}
})();
At this point, it looks like I have partial success; when I hover over the angular keyword I see type-specific information (i.e. namespace angular, var angular: ng.IAngularStatic) but none of the type information is coming through in the angular specific dependencies, i.e. when I hover over $window, it tells me it is of any type.
My questions:
What more do I have to do to get intellisense to work properly?
Is there a way around having to add the reference at the top of every single JS file I have in the codebase to be able to get intellisense working?
After some digging around, I found that this used to be supported in VS Code once upon a time but support was lost in the latest versions. Source: https://github.com/Microsoft/vscode/issues/8163
Recently I have been using angular JS and it is great. However, I do not really understand the injection inside out. I have been using this pattern for almost every page and it works.
var workoutApp = angular.module('workoutApp', []);
workoutApp.controller('workoutControllers', ['$scope', '$http', '$window', function ($scope, $http, $window) {
//do something with $scope.
Now I want to implement auto complete using ngMaterial http://codepen.io/anon/pen/VeNqYB
The syntax are totally different from what I have been doing so I am really confused. I tried to inject module this way,
var workoutApp = angular.module('workoutApp', ['ngMaterial', 'ngMessages', 'material.svgAssetsCache']);
but kept getting error. Can anyone please share some thoughts on this?
According to the docs, ngMaterial has dependencies on more than just angular.
In the CDN example (https://github.com/angular/material#cdn), you can see the dependencies.
<!-- Angular Material Dependencies -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.js"></script>
It sounds like the fix is as simple as adding these dependencies.
Related Issues
Installing Angular Material, "Failed to instantiate module ngMaterial" even though I'm using angular version 1.3.0