Bob Bob - 4 months ago 37
AngularJS Question

using jQuery function in AngularJS

codepen this is the working code

I have a working code for changing the status of the network.
But I used jQuery to achieve it and now I am using angular app for the same thing.

Could you please help me.

Below is the Angular Code I have tried from already existing plunker:


<!doctype html>
<html ng-app="plunker" >
<meta charset="utf-8">
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css">
<script src=""></script>
<script src="app.js"></script>
<body ng-controller="MainCtrl">
Hello {{name}}! {{online}}


var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
$ = 'World';
});$window, $rootScope) {
$ = navigator.onLine;
$window.addEventListener("offline", function () {
$rootScope.$apply(function() {
$ = false;
}, false);
$window.addEventListener("online", function () {
$rootScope.$apply(function() {
$ = true;
}, false);


  <div id="connection" ng-class="{'connected': online, 'disconnected': !online}">
    <span ng-if="$">Online<div></div></span>
    <span ng-if="!$">Offline<div></div></span>

Note that with this approach, the initial state of 'connecting...' is not handled.