I'm attempting to add a delayed effect to my view. After a button is clicked, a message is displayed, but I want it to disappear after 2000ms. I have tried implementing a $timeout function based on recommendations I found, but it doesn't seem to be working as expected.
Can anyone explain why the $timeout function is not working in this scenario?
Any advice on this issue would be greatly appreciated. Below is the code snippet:
// app.js
var app = angular.module('myApp', []);
// mainController.js
app.controller("mainController", ["$scope", function($scope, $timeout) {
$scope.fireTrigger = function(str) {
$scope.triggeredValue = (str) + " fired";
$timeout(function() {
$scope.triggeredValue = "";
}, 2000);
}
}]);
// index.html
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<title>myApp</title>
<link rel="stylesheet"
href="entertainment.css">
</head>
<body ng-controller="mainController">
<h3 ng-bind="triggeredValue"></h3>
// ...