ng-click not firing with Controller-As syntax

In my HTML, I have a ng-click directive and it's calling a function in my ProductListCtrl. I'm using the Controller As syntax and I don't know why it's not working. You usually just attach it to this. with the syntax but something is wrong.

Here is my HTML.

<form class="span2 pull-right" style="display: inline;">
    <label for="searchItem" style="font-size: large; font-weight: normal;">Item Code:</label>
    <input id="searchItem" type="search" style="color: #337ab7;" ng-model="vm.searchCriteria" />
    <button id="itemLookUpBtn" class="btn btn-sm" style="vertical-align: top; color: #337ab7;" ng-click="lookUpItem">Search</button>
</form>

This is my controller.

(function () {
    "use strict";
    var app = angular.module("productManagement")

    var ProductListCtrl = function (productResource) {
        var vm = this;
        vm.searchCriteria = null;
        productResource.query(/*{ $filter: "Price le 20", $orderby: "Price desc" },*/ function (data) {
            vm.products = data;
        });
        vm.lookUpItem = function () {
            console.log("Here");
                productResource.query({ search: vm.searchCriteria }, function (data) {
                if (data.length == 0) {
                    vm.noProducts = "No Results";
                    vm.products = null;
                } else {
                    vm.noProducts = null;
                    vm.products = data;
                }
            });
        }
    }
    app.controller("ProductListCtrl", ["productResource", ProductListCtrl]);
}());

Please use ProductListCtrl.lookUpItem(), like below -

    <button id="itemLookUpBtn" class="btn btn-sm" style="vertical-align: top; color: #337ab7;" ng-click="ProductListCtrl.lookUpItem()">Search</button>