TypeError: event.attribute is not a function at a.$$ChildScope.$$ChildScope.$scope.Increment1 in angularjs

I’m a beginner at angular.js
I got this error:

TypeError: event.attribute is not a function at a.$$ChildScope.$$ChildScope.$scope.Increment1

full error output in my browser chrome console:

> angular.js:11607 TypeError: event.attribute is not a function
>     at a.$$ChildScope.$$ChildScope.$scope.Increment1 (http://localhost:63342/New%20folder%20(2)/index1.html:33:27)
>     at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:198:303
>     at f (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:214:485)
>     at a.$$ChildScope.$$ChildScope.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:125:305)
>     at a.$$ChildScope.$$ChildScope.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:126:6)
>     at HTMLDivElement.<anonymous> (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:215:36)
>     at HTMLDivElement.c (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:32:389)

my codes:

<!DOCTYPE html>
<html>
<head>
    <title>Demo</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <link rel="stylesheet" href="css.css">
</head>
<body>

<div ng-app="app" ng-controller="ClickController">
<div id="bigdiv">
    <div id="div1" data-id="on" ng-click="Increment1($event)"></div>
    <div id="div2" data-id="on" ng-click="Increment1($event)"></div>
    <div id="div3" data-id="on" ng-click="Increment1($event)"></div>
    <br/>
    <div id="div4" data-id="on" ng-click="Increment1($event)"></div>
    <div id="div5" data-id="on" ng-click="Increment1($event)"></div>
    <div id="div6" data-id="on" ng-click="Increment1($event)"></div>
    <br/>
    <div id="div7" data-id="on" ng-click="Increment1($event)"></div>
    <div id="div8" data-id="on" ng-click="Increment1($event)"></div>
    <div id="div9" data-id="on" ng-click="Increment1($event)"></div>
    </div>
    <!--<button ng-click="start()">start</button>-->
    <input id="input1">
</div>
<script>
    var count=0;var m=0;var m1=0;
    var app = angular.module("app", []);
    app.controller("ClickController", function ($scope) {
        $scope.Increment1 = function (event) {
            var id=event.target.id;
            var cc= event.attribute("data-id");
            alert(cc);
            if(count%2==0 ){

            document.getElementById(id).style.backgroundColor = "blue";
                document.getElementById("input1").value ="blue";
                count++;
                m=1;
        }
       else if (count%2==1 ){
                document.getElementById(id).style.backgroundColor = "red";
                document.getElementById("input1").value ="red";
                count++;
                m1=1;

            }
                    }
    });
</script>
</body>
</html>

Source: AngularJS