5/8 Install App 1

#1

I'm struggling to figure out where I've gone wrong. I've triple checked it for syntax errors but I could use another pair of eyes.

The error I'm getting is: Did you add the function to installApp.js?

In installApp.js

app.directive('installApp', function(){
return{
restrict : 'E',
scope : {},
templateUrl : 'js/directives/installApp.html',
link : function(scope, element, attrs) {
scope.buttonText = "Install",
scope.installed = false,

scope.download = function() {
element.toggleClass('btn-active');
if(scope.installed) {
scope.buttonText = "Install";
scope.installed = false;
}
else {
scope.buttonText = "Uninstall";
scope.installed = true;
}
}
}
}});

In index.html




<!-- Include the AngularJS library -->
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>





App Market



<div class="main" ng-controller="MainController">
  <div class="container">
    <div class = "card" ng-repeat = "app in apps">
      <app-info info ="info"></app-info>
      </div>
     <div class="card"> 
       <app-info info="move"></app-info> 
     </div>

    <div class="card"> 
       <app-info info="shutterbugg"></app-info> 
     </div>

    <div class="card"> 
       <app-info info="gameboard"></app-info> 
     </div>
    <div class="card"> 
       <app-info info = "forecast"></app-info> 
     </div>
  </div>
  
</div>

<!-- Modules -->
<script src="js/app.js"></script>

<!-- Controllers -->
<script src="js/controllers/MainController.js"></script>

<!-- Directives -->
<script src="js/directives/appInfo.js"></script>
<script src="js/directives/installApp.js"></script>


Installapp I 5/8
#2

Got it. For anyone who has a similar issue, the key is to remember that while closing functions do not require a ";" in JS, return statements do.

#3

I am facing exactly the same issue described by @latelladuboyce. I keep getting the "Did you add the function to installApp.js"

How do I get around this problem? The following is how my directive definition looks:

app.directive("installApp", function() {
return {
restrict: 'E',
scope: {},
templateUrl: 'js/directives/installApp.html',
link: function(scope, element, attrs) {
scope.buttonText = "Install",
scope.installed = false,

  scope.download = function() {
    element.toggleClass('btn-active');
    if(scope.installed) {
      scope.buttonText = "Install";
      scope.installed = false;
    } else {
      scope.buttonText = "Uninstall";
      scope.installed = true;
    }
  }
}

};
});

#4

I run this code and it was worked. Maybe u can try to refresh your browser and also your exercise.

In installApp.js

app.directive('installApp', function() {
return {
restrict: 'E',
scope: { },
templateUrl: 'js/directives/installApp.html',
link: function(scope, element, attrs) {
scope.buttonText = "Install",
scope.installed = false, 

	 scope.download = function() { 
 	 element.toggleClass('btn-active');  
	       if(scope.installed) { 
               scope.buttonText = "Install"; 
               scope.installed = false; 
	        } else { 
               scope.buttonText = "Uninstall"; 
               scope.installed = true; 
	       }
	} 
}

};
});

#5

There is space between : and link which shluld be removed.
Once it is done, Code will work for sure :smile:

#6

m getting no error in installApp I but not able to pass this thing.

my directive is

app.directive('installApp',function(){
return{
restrict : 'E',
$scope: {},
templateURL:'js/directives/installApp.html'
};
});
not able to proceed further can anyone help me?

#7

This is the solution: in the link option. delete the space between link and : like this:

link: function(scope, element, attrs) {

#8

Yes it is link:space and start

#11

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.