On hover of list view's avatar it should change into checkbox

I have a requirement where I am facing problem. The requirement is : I have a LIST VIEW in which every LIST ITEM having an CIRCULAR AVATAR.

What I want? On hover of CIRCULAR AVATAR of LIST ITEM it should change into a checkbox to select this list item.

And Also all the LIST ITEM above and below should also show CHECKBOX instead of avatar for MULTI-SELECT of LIST ITEMS.

I am using angular-material and angularJs in my project.

For Demo purpose please check the link. http://ift.tt/1tLnsCU

Thanks in advance.